Practical Projects With Astro Js

Converting Designs to Code

What you'll learn

Learn Astro Js

Create Websites using Astro 4

Practical Applications

Adding SSR to Astro

Requirements

Intermediate knowledge of Javascript

Node js

Visual Studio Code

Basics of Astro 4

Description

Welcome to Practical Project with Astro JSIn this comprehensive course we will write three beginner to intermidiate Astro 4 websites. If you want to learn the fastest growing javascript framework for content websites, look no further. Astro JS is a great framework for beginners and professionals alike. As we will not be going to the very basics of Astro JS it is recommended to use this course as more of a portfolio boost to showcase your skills.You will learn:How to convert a Canva website templateHow to convert a Figma Design to Astro WebsiteHow to breakdown a design into codeHow to create an Astro.js WebsiteHow to add Authentication in Astro JSProjectsConvert a Canva Website Template to Astro JSConvert a Figma Website Template to Astro JSCreate an Astro JS Web Application with User AuthenticationWho am I?I am a freelance web developer with a passion for teaching web development, as a visual learner I will go step by step through the process of creating a website and deconstructing a design from free resources available online.I really hope you enjoy the course and learn this great JavaScript framework.Enjoy

Overview

Section 1: Introduction

Lecture 1 Course Introduction

Section 2: Canva Design to Astro JS

Lecture 2 Project Overview & Setup

Lecture 3 Featured Image - Coding the Hero section

Lecture 4 Coding the About Section

Lecture 5 What we Offer - Custom Card Components

Lecture 6 Coding the Testimonial Section

Lecture 7 Wrapping it up - Coding the Footer

Lecture 8 Deploying Website to Netlify

Section 3: Figma Design to Astro JS

Lecture 9 Project Overview

Lecture 10 Creating a new Astro Project

Lecture 11 Creating the Hero & About Sections

Lecture 12 Adding a Product Gallery Section

Lecture 13 Adding a Feature Section

Lecture 14 Adding Testimonials

Beginner Developers looking to create practical projects,Intermediate Developer looking to expand portfolio