{"id":6764,"date":"2026-08-10T09:36:54","date_gmt":"2026-08-10T09:36:54","guid":{"rendered":"https:\/\/nokobox.com\/index.php\/item\/astro-course-build-modern-websites-with-astro-2024-10\/"},"modified":"2026-08-10T09:36:54","modified_gmt":"2026-08-10T09:36:54","slug":"astro-course-build-modern-websites-with-astro-2024-10","status":"publish","type":"digital_item","link":"https:\/\/nokobox.com\/index.php\/item\/astro-course-build-modern-websites-with-astro-2024-10\/","title":{"rendered":"Astro Course \u2013 Build Modern Websites with Astro! 2024-10"},"content":{"rendered":"<div class=\"w-post-elm post_content\">\n<h2><span style=\"vertical-align: inherit\">Description<\/span><\/h2>\n<p data-sourcepos=\"5:1-5:110\"><span style=\"vertical-align: inherit\">Build Modern Websites with Astro course! This course teaches you how to build a website using Astro 4.0, a versatile modern web framework. This course is suitable for beginner to intermediate JavaScript developers. You are expected to have basic knowledge of JavaScript and HTML\/CSS. Experience with frameworks is recommended but not required.<\/span><\/p>\n<h3 data-sourcepos=\"7:1-7:25\"><span style=\"vertical-align: inherit\">What you will learn<\/span><\/h3>\n<ul data-sourcepos=\"9:1-26:0\">\n<li data-sourcepos=\"9:1-11:0\">\n<p data-sourcepos=\"9:3-10:270\"><span style=\"vertical-align: inherit\">Full-stack Markdown Blog In this course, you\u2019ll take your blog to the next level by adding powerful features like tags, pagination, authentication, comments, and more! You will also learn to use modern technologies such as Tailwind CSS, TypeScript, Xata and Cloudinari.<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"12:1-12:43\">\n<p data-sourcepos=\"12:3-12:43\"><span style=\"vertical-align: inherit\">Static Site Generation<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"13:1-13:39\">\n<p data-sourcepos=\"13:3-13:39\"><span style=\"vertical-align: inherit\">Server-side rendering<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"14:1-14:40\">\n<p data-sourcepos=\"14:3-14:40\"><span style=\"vertical-align: inherit\">Content Collections<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"15:1-15:29\">\n<p data-sourcepos=\"15:3-15:29\"><span style=\"vertical-align: inherit\">Astro Islands<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"16:1-16:18\">\n<p data-sourcepos=\"16:3-16:18\"><span style=\"vertical-align: inherit\">Image optimization<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"17:1-17:25\">\n<p data-sourcepos=\"17:3-17:25\"><span style=\"vertical-align: inherit\">Integrations<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"18:1-18:14\">\n<p data-sourcepos=\"18:3-18:14\">Tailwind CSS<\/p>\n<\/li>\n<li data-sourcepos=\"19:1-19:26\">\n<p data-sourcepos=\"19:3-19:26\"><span style=\"vertical-align: inherit\">Types of typescript and Zod<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"20:1-20:27\">\n<p data-sourcepos=\"20:3-20:27\"><span style=\"vertical-align: inherit\">API routes \/ endpoints<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"21:1-21:24\">\n<p data-sourcepos=\"21:3-21:24\"><span style=\"vertical-align: inherit\">Pagination<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"22:1-22:23\">\n<p data-sourcepos=\"22:3-22:23\"><span style=\"vertical-align: inherit\">How to work with Markdown<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"23:1-23:18\">\n<p data-sourcepos=\"23:3-23:18\"><span style=\"vertical-align: inherit\">SEO and meta tags<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"24:1-24:12\">\n<p data-sourcepos=\"24:3-24:12\"><span style=\"vertical-align: inherit\">RSS feeds<\/span><\/p>\n<\/li>\n<li data-sourcepos=\"25:1-26:0\">\n<p data-sourcepos=\"25:3-25:43\"><span style=\"vertical-align: inherit\">Deploying and Hosting<\/span><\/p>\n<\/li>\n<\/ul>\n<h3 data-sourcepos=\"27:1-27:37\"><span style=\"vertical-align: inherit\">Who is this course suitable for?<\/span><\/h3>\n<ul data-sourcepos=\"31:1-34:0\">\n<li data-sourcepos=\"31:1-31:47\"><span style=\"vertical-align: inherit\">They have basic knowledge of HTML, CSS and JavaScript.<\/span><\/li>\n<li data-sourcepos=\"32:1-32:65\"><span style=\"vertical-align: inherit\">Interested in learning new skills to enhance their resume.<\/span><\/li>\n<li data-sourcepos=\"33:1-34:0\"><span style=\"vertical-align: inherit\">They are familiar with a framework (its use is recommended, but not mandatory).<\/span><\/li>\n<\/ul>\n<h3><span style=\"vertical-align: inherit\">Course specifications<\/span><\/h3>\n<ul>\n<li><span style=\"vertical-align: inherit\">Publisher: <\/span><a href=\"https:\/\/href.li\/?https:\/\/astrocourse.dev\/\" target=\"_blank\" rel=\"noopener\"><span style=\"vertical-align: inherit\">Astrocourse<\/span><\/a><\/li>\n<li><span style=\"vertical-align: inherit\">Lecturer: <\/span><a href=\"https:\/\/downloadlynet.ir\/tag\/james-q-quick\/\"><span style=\"vertical-align: inherit\">James Q Quick<\/span><\/a><\/li>\n<li><span style=\"vertical-align: inherit\">Training level: advanced<\/span><\/li>\n<li><span style=\"vertical-align: inherit\">Training duration: 7 hours and 29 minutes<\/span><\/li>\n<li><span style=\"vertical-align: inherit\">Number of courses: 91<\/span><\/li>\n<\/ul>\n<h3><span style=\"vertical-align: inherit\">Course headings<\/span><\/h3>\n<ul>\n<li dir=\"ltr\" style=\"text-align: left\">Welcome and Thank You<br \/>Resources<br \/>Intro To Astro<br \/>Astro 4.0<br \/>Creating Your First Astro Project<br \/>The Dev Toolbar<br \/>Working with Git and Github<br \/>VS Code Setup<br \/>Shortcuts That I Use<br \/>Working With CSS<br \/>Overview of Astro Integrations<br \/>Introduction to Tailwind CSS<br \/>Setting Up Tailwind CSS<br \/>Updating the Shared Layout<br \/>Updating the Header and Footer Components<br \/>Introduction to Markdown and Frontmatter<br \/>Introduction to Content Collections<br \/>Configuring Content Collections with Zod<br \/>Querying and Displaying List of Blog Posts<br \/>Creating the PostList Component<br \/>Creating Dynamic Routes for Blog Posts<br \/>Displaying Blog Posts<br \/>Styling Blog Posts Using The Tailwind Typography Plugin<br \/>Cleaning Up Code With Reusable Components<br \/>Creating the TableOfContents Component<br \/>Creating the Share Component<br \/>Intro to Pagination<br \/>Creating The Dynamic Route for Paginated Blog Posts<br \/>Creating the Pagination Component<br \/>Introduction to Meta Tags<br \/>Adding Meta Tags<br \/>Customizing Meta Tags Per Page<br \/>Adding an RSS Feed<br \/>Displaying Categories<br \/>Creating Dynamic Routes for Category Pages<br \/>Displaying a Featured Post<br \/>Displaying Recent Posts<br \/>Refactoring the CategoryList Component<br \/>Intro to the Astro Image Component<br \/>Setting Up The Astro Image Component<br \/>Section Intro<br \/>Adding Svelte (and Client Directives)<br \/>Handling Form Submissions with KwesForms<br \/>Setting Up a Github Repository<br \/>Deploying to Netlify<br \/>Deploying to Vercel<br \/>Updating the Site Config Property<br \/>Next Steps<br \/>Overview of the Premium Content<br \/>Overview of SSR In Astro<br \/>Adding the Netlify Adapter<br \/>Converting Blog Post Pages to SSR<br \/>Fixing a Pagination Bug<br \/>Converting Category Pages to SSR<br \/>Fixing Pagination Bugs<br \/>Adding An Environment Variable For Posts Per Page<br \/>Creating the Authors Collection<br \/>Displaying Author Info For Blog Posts<br \/>Creating Dynamic Routes for Author Pages<br \/>Intro to Cloudinary and Account Setup<br \/>Installing and Configuring Cloudinary in Astro<br \/>Adding Auto Generated Image URLs<br \/>Intro to Xata<br \/>Creating the Users Schema<br \/>Creating the Comments Schema<br \/>Integrating Xata Into Astro and Generating TypeScript Types<br \/>Overview of Authentication with Cookies<br \/>Creating the Signup Page<br \/>Handling the Signup Endpoint<br \/>Securing Our Cookies<br \/>Creating the Login Page<br \/>Handling the Login Endpoint<br \/>Handling Errors<br \/>Handling the Sign Out Endpoint<br \/>Updating the Header<br \/>Handling Redirects after Login<br \/>Creating the Comment Form<br \/>Handling Comment Form Submission<br \/>Querying Comments for a Blog Post<br \/>Displaying Comments for a Blog Post<br \/>Section Intro<br \/>Displaying Emojis<br \/>Setting up the Reactions Table<br \/>Handling Emoji Reactions<br \/>Querying Emojis<br \/>Creating the Newsletter Form<br \/>Handling the Newsletter Form Submission<br \/>Saving Subscriber Emails to Xata<br \/>Creating the Success and Failure Pages<br \/>Deploy to Vercel<br \/>Deploy to Netlify<\/li>\n<\/ul>\n<h3><span style=\"vertical-align: inherit\">Images of Build Modern Websites with Astro course<\/span><\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-941394 size-full\" src=\"https:\/\/downloadly.ir\/wp-content\/uploads\/2024\/11\/Build-Modern-Websites-with-Astro.jpg\" alt=\"Build Modern Websites with Astro\" width=\"969\" height=\"258\"><\/p>\n<h3><span style=\"vertical-align: inherit\">Sample video of the course<\/span><\/h3>\n<div style=\"width: 640px;\" class=\"wp-video\"><span class=\"mejs-offscreen\">Video Player<\/span><\/p>\n<div id=\"mep_0\" class=\"mejs-container mejs-container-keyboard-inactive wp-video-shortcode mejs-video\" tabindex=\"0\" role=\"application\" aria-label=\"Video Player\" style=\"width: 640px; height: 360px; min-width: 217px;\">\n<div class=\"mejs-inner\">\n<div class=\"mejs-mediaelement\"><mediaelementwrapper id=\"video-144952-1\"><video class=\"wp-video-shortcode\" id=\"video-144952-1_html5\" width=\"640\" height=\"360\" preload=\"metadata\" src=\"https:\/\/dl.downloadly.ir\/Files\/Elearning\/Sample\/Build_Modern_Websites_with_Astro_Downloadly.ir.mp4?_=1\" style=\"width: 640px; height: 360px;\"><source type=\"video\/mp4\" src=\"https:\/\/dl.downloadly.ir\/Files\/Elearning\/Sample\/Build_Modern_Websites_with_Astro_Downloadly.ir.mp4?_=1\"><a href=\"https:\/\/dl.downloadly.ir\/Files\/Elearning\/Sample\/Build_Modern_Websites_with_Astro_Downloadly.ir.mp4?nocache=1786108042057\">https:\/\/dl.downloadly.ir\/Files\/Elearning\/Sample\/Build_Modern_Websites_with_Astro_Downloadly.ir.mp4<\/a><\/video><\/mediaelementwrapper><\/div>\n<div class=\"mejs-layers\">\n<div class=\"mejs-poster mejs-layer\" style=\"display: none; width: 100%; height: 100%;\"><\/div>\n<div class=\"mejs-overlay mejs-layer\" style=\"display: none; width: 100%; height: 100%;\">\n<div class=\"mejs-overlay-loading\"><span class=\"mejs-overlay-loading-bg-img\"><\/span><\/div>\n<\/div>\n<div class=\"mejs-overlay mejs-layer\" style=\"display: none; width: 100%; height: 100%;\">\n<div class=\"mejs-overlay-error\"><\/div>\n<\/div>\n<div class=\"mejs-overlay mejs-layer mejs-overlay-play\" style=\"width: 100%; height: 100%;\">\n<div class=\"mejs-overlay-button\" role=\"button\" tabindex=\"0\" aria-label=\"Play\" aria-pressed=\"false\"><\/div>\n<\/div>\n<\/div>\n<div class=\"mejs-controls\">\n<div class=\"mejs-button mejs-playpause-button mejs-play\"><button type=\"button\" aria-controls=\"mep_0\" title=\"Play\" aria-label=\"Play\" tabindex=\"0\"><\/button><\/div>\n<div class=\"mejs-time mejs-currenttime-container\" role=\"timer\" aria-live=\"off\"><span class=\"mejs-currenttime\">00:00<\/span><\/div>\n<div class=\"mejs-time-rail\"><span class=\"mejs-time-total mejs-time-slider\" role=\"slider\" tabindex=\"0\" aria-label=\"Time Slider\" aria-valuemin=\"0\" aria-valuemax=\"0\" aria-valuenow=\"0\" aria-valuetext=\"00:00\"><span class=\"mejs-time-buffering\" style=\"display: none;\"><\/span><span class=\"mejs-time-loaded\"><\/span><span class=\"mejs-time-current\"><\/span><span class=\"mejs-time-hovered no-hover\"><\/span><span class=\"mejs-time-handle\"><span class=\"mejs-time-handle-content\"><\/span><\/span><span class=\"mejs-time-float\"><span class=\"mejs-time-float-current\">00:00<\/span><span class=\"mejs-time-float-corner\"><\/span><\/span><\/span><\/div>\n<div class=\"mejs-time mejs-duration-container\"><span class=\"mejs-duration\">00:00<\/span><\/div>\n<div class=\"mejs-button mejs-volume-button mejs-mute\"><button type=\"button\" aria-controls=\"mep_0\" title=\"Mute\" aria-label=\"Mute\" tabindex=\"0\"><\/button><a href=\"javascript:void(0);\" class=\"mejs-volume-slider\" aria-label=\"Volume Slider\" aria-valuemin=\"0\" aria-valuemax=\"100\" role=\"slider\" aria-orientation=\"vertical\"><span class=\"mejs-offscreen\">Use Up\/Down Arrow keys to increase or decrease volume.<\/span><\/p>\n<div class=\"mejs-volume-total\">\n<div class=\"mejs-volume-current\" style=\"bottom: 0px; height: 100%;\"><\/div>\n<div class=\"mejs-volume-handle\" style=\"bottom: 100%; margin-bottom: -3px;\"><\/div>\n<\/div>\n<p><\/a><\/div>\n<div class=\"mejs-button mejs-fullscreen-button\"><button type=\"button\" aria-controls=\"mep_0\" title=\"Fullscreen\" aria-label=\"Fullscreen\" tabindex=\"0\"><\/button><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div>\n<h3><span style=\"vertical-align: inherit\">Installation guide<\/span><\/h3>\n<p><span style=\"vertical-align: inherit\">After Extract, view with your favorite Player.<\/span><\/p>\n<p><span style=\"vertical-align: inherit\">Subtitle: None<\/span><\/p>\n<p><span style=\"vertical-align: inherit\">Quality: 1080p<\/span><\/p>\n<\/div>\n<h3><span style=\"vertical-align: inherit\">download link<\/span><\/h3>\n<p><a href=\"https:\/\/dl2.downloadly.ir\/Files\/Elearning\/Astro_Course_Build_Modern_Websites_with_Astro_2024-10.part1_Downloadly.ir.rar?nocache=1786108041\"><span style=\"vertical-align: inherit\">Download part 1 \u2013 1 GB<\/span><\/a><\/p>\n<p><a href=\"https:\/\/dl2.downloadly.ir\/Files\/Elearning\/Astro_Course_Build_Modern_Websites_with_Astro_2024-10.part2_Downloadly.ir.rar?nocache=1786108041\"><span style=\"vertical-align: inherit\">Download part 2 \u2013 586 MB<\/span><\/a><\/p>\n<p><span style=\"vertical-align: inherit\">File(s) password: www.downloadly.ir<\/span><\/p>\n<h3><span style=\"vertical-align: inherit\">File size<\/span><\/h3>\n<p><span style=\"vertical-align: inherit\">1.5 GB<\/span><\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Description Build Modern Websites with Astro course! This course teaches you how to build a website using Astro 4.0, a versatile modern web framework. This cour<\/p>\n","protected":false},"author":1,"template":"","dgi_category":[10458],"dgi_tag":[63407,63408,63409,63410,63411,63412],"class_list":["post-6764","digital_item","type-digital_item","status-publish","has-post-thumbnail","hentry","dgi_category-video-tutorials","dgi_tag-course-build-modern-websites-with-astro","dgi_tag-download-build-modern-websites-with-astro","dgi_tag-download-course-build-modern-websites-with-astro","dgi_tag-free-build-modern-websites-with-astro","dgi_tag-free-download-build-modern-websites-with-astro","dgi_tag-james-q-quick"],"_links":{"self":[{"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/digital_item\/6764","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/digital_item"}],"about":[{"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/types\/digital_item"}],"author":[{"embeddable":true,"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":0,"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/digital_item\/6764\/revisions"}],"wp:attachment":[{"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/media?parent=6764"}],"wp:term":[{"taxonomy":"dgi_category","embeddable":true,"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/dgi_category?post=6764"},{"taxonomy":"dgi_tag","embeddable":true,"href":"https:\/\/nokobox.com\/index.php\/wp-json\/wp\/v2\/dgi_tag?post=6764"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}