Overview
Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
This Specialization teaches you how to build full-stack web applications using HTML, CSS, JavaScript, React, Node.js, SQL, and Next.js. Designed for aspiring developers and engineers, it covers everything from the absolute basics to fully deployed applications. You’ll gain hands-on experience developing both front-end interfaces and back-end systems, and finish with an in-demand tech stack to launch your web development career.
Syllabus
- Course 1: Learn HTML and CSS
- Course 2: Learn JavaScript
- Course 3: Command Line (CLI) & Terminal Basics
- Course 4: Learn Accessible Web Design
- Course 5: Learn CSS Flexbox
- Course 6: Learn CSS Grid
- Course 7: Learn CSS Variables
- Course 8: Learn Responsive Web Design
- Course 9: Learn CSS Animations
- Course 10: Learn Tailwind CSS
- Course 11: Async JavaScript
- Course 12: Advanced JavaScript 2: Async JS, APIs, Operators, Objects
- Course 13: Intro to AI Engineering
- Course 14: Learn Node.js
- Course 15: Intro to SQL
- Course 16: Learn Express.js
- Course 17: Learn UI Design
- Course 18: Learn React
- Course 19: Beginner's Guide to Unit Testing
- Course 20: Learn Advanced React
- Course 21: Learn Typescript
- Course 22: Learn Next.js
Courses
-
This course is perfect if you want to learn how to code websites from scratch. You will learn the basics of HTML and CSS through interactive challenges. Along the way, you will build multiple projects, like a Google.com clone, a Space Exploration page, and a fun birthday site filled with GIFs. While most of the challenges are done in Scrimba's interactive editor, you will also learn how to use professional tools like VS Code for code editing, GitHub for hosting your code, and Netlify for deploying your projects to the world wide web.
-
This is perhaps the most interactive JavaScript course ever recorded. It contains 140+ coding challenges, meaning that you will finally build that ever-so-important JavaScript muscle memory. You will solve the challenges directly in the browser thanks to Scrimba's interactive video technology, so there's not setup needed. Say goodbye to "tutorial hell" and get ready to start feeling your JavaScript superpowers grow exponentially. Another unique thing with this course is that you will build projects from the very start. Instead of long and boring theoretical lessons, you will dive head-first into building products and solving challenges. At the end of the course, you will have built a game, a Chrome extension, and even a mobile app the uses Google Firebase to persist data. This is learning by doing on steroids.
-
This is the ideal starting point for anyone eager to learn modern React basics in the most interactive, hands-on way possible. Throughout this course, you'll tackle over 170 interactive coding challenges and build six exciting projects. If you're tired of React courses that leave you staring blankly at an empty editor screen, you're in the right place! Here, you'll **actually build React projects by the end**, giving you the confidence and skills to tackle real-world applications. Section 1: Static pages (project: ReactFacts site) In this introductory section, you'll get familiar with React basics, including components, JSX, and styling. You’ll create a simple ReactFacts site, learning about composable and declarative code, React elements, and best practices for building static pages in React. Topics covered: - Intro to React - Why React?: Composable & Declarative - React Elements - JSX - Creating custom components - Fragments - Styling with Classes Section 2: Data-Driven React (project: Travel Journal) Next, you’ll discover how to make your React apps dynamic by introducing reusable components, props, and data-driven rendering. In the inspiring Travel Journal project, you’ll map data to components, handle static assets, and use props to personalize the user experience. Topics covered: - Reusable components - Props - Evaluating JS inside JSX - Handling static assets - Mapping data to components Section 3: React State (project: Chef Claude) This module introduces you to React's state management, allowing you to handle events, manage complex state, and create responsive forms. The Chef Claude project will help you see the difference between props and state, implement conditional rendering, and dynamically style components based on user interaction. Topics covered: - Event listeners - Props vs. State - Creating & changing state - Complex state - Forms & form actions - Conditional rendering - Setting state from children - Dynamic styles Section 4: Side effects (project: Meme Generator) Explore side effects in React with this module on data fetching, controlled components, and refs. In the Meme Generator project, you’ll practice managing side effects, optimizing dependencies, and cleaning up resources, giving you a robust foundation for handling external data and effects. Topics covered: - Controlled components/forms - Functional programming in React - Fetching data - Handling side effects - Side effect dependencies - Cleaning up side effects - Refs Section 5: Capstone project 1: Tenzies game This capstone project challenges you to put everything you've learned into action by building a complete Tenzies game. Through step-by-step challenges, you'll improve your skills by learning lazy state initialization and accessibility, creating a polished, interactive experience. Topics covered: - Series of challenges to build the capstone project - Lazy state initialization - Accessibility improvements Section 6: Capstone project 2: Assembly: Endgame In this final capstone, you'll face a series of challenges to build a complex, multi-featured app. By the end of Assembly: Endgame, you’ll have gained real-world experience in problem-solving and combining all the React skills you've developed throughout the course. Topics covered: Series of challenges to build the capstone project Why this course? This course is filled with coding challenges that you'll complete by writing React code directly inside the browser! Before you know it, you'll have written six interactive React applications! You’ll also benefit from spaced learning and repetition in this course. Make sure you give yourself time (days/weeks) to finish it, and include lots of breaks. Don't try cramming it all in at once. Once you are done, you will feel confident in your React skills and be ready to continue your coding journey.
-
This massive UI design course teaches you to build beautiful and well-functioning user interfaces using HTML and CSS. It's filled with interactive tutorials to ensure that the knowledge sticks with you. Created by Gary Simon, the most popular online instructor on this subject. While we can all clearly recognize what a great user interface looks like, it's actually really hard to build one! That's exactly what this course is all about. In it, Gary Simon will turn you into a UI design master. He'll teach you UI design from the ground up, and give you the skills you need to make sure that your next project both looks good and feels good to use.
 
It starts from the very basics, so you don't need any UI design experience to join, just basic HTML and CSS skills.

-
This course will take you to a professional level in responsive web design. You'll learn to build advanced layouts while solving fun coding challenges along the way. Let me ask you a few questions: Do you want to learn to build responsive websites that look 100% professional? Do you want to be confident that your website works well on all devices? Are you tired of feeling that your CSS is a mess? If your answer is YES, then this is the perfect course for you! It gives you a deep understanding of CSS and responsive design while keeping you fully engaged along the way. You'll learn to build four different layouts: a blog, a landing page, a banner, and a company website. Each one will take your skills to a new level. To ensure that the knowledge sticks with you, you are given interactive coding challenges as you progress. It's as if you and the instructor are pair-programming together! This kind of fast-paced interactivity simply isn't possible with any other platform than Scrimba!
-
CSS Custom Properties represent a significant advancement for front-end developers, introducing the concept of variables to CSS. This innovation substantially reduces redundancy, enhances code legibility, and augments overall flexibility. Notably, CSS Variables distinguish themselves from their CSS preprocessor counterparts by seamlessly integrating into the Document Object Model (DOM), offering a plethora of advantages. The course encompasses a structured curriculum comprising eight interactive screencasts, characterized by their concise and focused nature. Following the conclusion of most screencasts, the instructor actively engages you in practical problem-solving challenges, seamlessly integrated within the screencast interface. This pedagogical approach serves as an effective means of reinforcing knowledge retention, allowing you to validate the alignment of your solutions with the instructor's expertise.
-
This course introduces you to the essential building blocks of TypeScript through a hands-on approach. You'll explore the fundamentals of TypeScript, learn to leverage TypeScript in React, and explore TypeScript in Express, plus build a TypeScript-based project. TypeScript catches errors before your code even runs. That means fewer bugs, smoother projects, and less rage-quitting! Plus, its type system makes refactoring and collaborating a breeze. In the first module, Getting Started with TypeScript, you'll cover: - Basic, literal & custom types - Arrays, objects & optional properties - Union types Module Two, Applying Advanced TypeScript concepts, introduces you to: - Narrowing, return types, and utility types - Function calls Module Three, TypeScript in React, will acquaint you with: - Initialising a React + TypeScript project - Typing useState, props & components - Working with JSX that may return null Finally, in the TypeScript in Express module, you'll get to grips with: - Setting up a TS-powered Express server - Typed requests, responses & data - Handling CORS, 404s, IDs & query params - Automating server restarts with confidence Ready to make your code safer? Let's go!
-
The CSS Grid module is a pivotal tool that streamlines website layout creation, offering simplicity in both HTML and CSS while affording greater control over a website's layout. This course equips front-end developers with essential skills to harness CSS Grid effectively, ensuring they remain at the forefront of web development trends. Whether you're building layouts from scratch or enhancing your existing skills, our comprehensive modules guide you through every aspect of CSS Grid, from fundamentals to advanced techniques. The course is also interactive, meaning that you'll get your hands on the keyboard to solve coding challenges several times. This is both fun and helps you solidify your skills.
-
Mastering CSS Flexbox: Unlock the Power of Flexible Web Layouts Discover the indispensable art of CSS Flexbox and elevate your web development prowess to new heights. In this comprehensive course, you'll gain proficiency in harnessing the unparalleled capabilities of Flexbox, revolutionizing the way you construct websites. In today's dynamic digital landscape, the demand for flexible and responsive web design has never been greater. Acquiring proficiency in Flexbox is no longer a choice but an essential skillset for any aspiring web developer. Course Highlights: Our course is meticulously designed to propel your knowledge and skills to the forefront of web development. From the very first lecture, you'll embark on a transformative journey that empowers you to implement Flexbox with precision and finesse. Key Learning Points: Foundations of Flexbox: Gain a deep understanding of Flexbox principles, enabling you to create adaptable and efficient layouts. Hands-On Practice: Dive into practical exercises meticulously crafted to reinforce your learning. Develop your proficiency as you tackle real-world challenges. Designing a Responsive Navbar: Explore a quintessential use case for Flexbox as we guide you in crafting a responsive navigation bar, ensuring seamless user experiences. Advanced Techniques: Elevate your skills with bonus screencasts where we demonstrate the integration of Flexbox in building two impressive real-world examples: a stunning image grid and a fully responsive navbar. Expert Guidance: Follow the journey of course creator Per Harald Borgen and stay updated with industry insights by connecting with him on Twitter. By the end of this course, you'll be equipped with the knowledge and expertise to transform your web development projects with the elegance and efficiency of CSS Flexbox. Join us today and embark on your journey towards becoming a proficient and sought-after web developer.
-
Elevate your expertise with our Advanced React course. Building upon your foundational knowledge, this course delves into advanced React patterns, internal workings, and the implementation of complex applications using React Router. Taught by industry veteran Bob Ziroll, who has successfully guided thousands of students towards rewarding careers in front-end development, this course equips you with in-depth React proficiency that stands out in the competitive job market. Why React? As the most sought-after front-end library globally, React not only offers abundant job opportunities but also enhances your overall JavaScript proficiency. Unlike other libraries, React fosters core JavaScript skills, empowering you to master the art of web development. Take your front-end development career to the next level with our Advanced React Development course.
-
Upon completing the this course, learners will have established a robust foundation in AI principles and hands-on proficiency with AI tools and APIs. They will learn the art of crafting and manipulating AI models, enabling them to integrate AI into applications with confidence. This course stands out by offering a detailed exploration of AI engineering, from the basics to deeper techniques like the "Few Shot" approach and the creation of images with the latest DALL·E 3 API. Participants will also learn to navigate AI safety and ethical considerations, ensuring responsible use of AI technology. With a blend of theoretical knowledge and practical application, this course is uniquely positioned to empower learners to become innovative problem solvers in the AI domain.
-
Are you eager to acquire a comprehensive grasp of CSS animations and harness the ability to apply them effectively in practical, real-world scenarios? If so, this is the perfect opportunity! In the span of two hours, you will gain a foundational comprehension of the CSS properties instrumental in crafting animations. This course equips you with the expertise to construct user-friendly animations while ensuring cross-browser compatibility. Throughout the course, you will encounter challenges replete with real-world instances, mirroring the scenarios routinely encountered by developers. These exercises serve as invaluable opportunities to practically assess and reinforce your newfound knowledge.
-
Unlock the power of Tailwind CSS in this hands-on course designed for all skill levels! You'll begin with the essentials, exploring key concepts like element sizing, colors, padding, and margin, then progressively build up to more advanced techniques such as responsive design and modifiers. Through a mix of theory lessons and real-world projects, you’ll not only understand how to use Tailwind CSS but gain the skills to structure beautiful, flexible, and efficient layouts from scratch. With each lesson, you’ll add new styling methods to your toolkit, ensuring you’re prepared to create anything from simple webpages to complex, responsive interfaces. By the end, you’ll confidently build engaging and professional designs using Tailwind CSS. Skills Covered: - Responsive Design - Typography Styling - Layout and Positioning - Flexbox - Utility-based Styling
-
This course is all about making the web a better place for everyone. You'll dive into what it truly means to build accessible websites and why it's so important. You'll get to grips with all the fundamentals of accessible development, like understanding contrast ratios, exploring the accessibility tree, getting familiar with WCAG levels, and much more. But it's not just about theory. You'll be applying what you learn in interactive challenges, fixing up a real-world website that contains a range of accessibility flaws.
 By the time you finish this course, you'll have the skills and knowledge to create websites that are welcoming to everyone, making a tangible difference in the digital world.
-
This concise one-hour course dives into asynchronous JavaScript, a key concept for crafting efficient web applications. It covers the essentials of non-blocking execution with promises, async/await, and callbacks, demonstrating how these features enable tasks such as API calls to function without freezing the user interface. Upon completing this course, learners will confidently use asynchronous JavaScript, equipping them with skills to tackle modern web development challenges. Ideal for those with basic JavaScript knowledge, this course is a fast track to gaining a solid understanding of asynchronous programming essentials.
-
Code with confidence and lower your stress levels by learning how to test your code as you write it! Unit testing is in high demand, with good reason! Testing your code allows you to check that your logic works as expected every time, giving you code confidence, lowering stress levels, and allowing you to deliver faster results. The earlier you start incorporating unit tests into your code base, the better - but it’s never too late. That means that this course is suitable for both newbie coders and those already working in the field who want to level up. This course covers test grouping, test cases, debugging tests with focus, spies, and more in just one hour, plus it offers plenty of challenges to cement your new knowledge. You’ll also learn about the 3 A’s (Arrange, Act, Assert), and write plenty of tests. Knowledge of Unit Testing removes coding doubts, leads to faster development, and reduces bugs, so do your future self a favor and learn Unit Testing today.
-
This course focuses on enhancing your JavaScript skills by working with asynchronous programming, APIs, logical operators, and objects. You will learn how to fetch and handle API data using modern techniques such as async/await and promises, efficiently managing multiple asynchronous operations. Additionally, you’ll explore the use of logical operators like ||, &&, and nullish coalescing to write cleaner, more efficient code. The course also covers object manipulation in depth, including working with inbuilt methods, the spread operator, and cloning techniques. Throughout the course, you'll tackle practical coding challenges to solidify your understanding of JavaScript concepts like this binding, short-circuiting, and object method handling.
-
Learn to build web apps with Next.js, the world's most popular full-stack framework. You'll cover routing, layouts, data fetching, optimizing assets, and more, while building PrintForge, a site for 3D printing enthusiasts. Next.js is a powerful React framework for building modern web applications. It combines blazing performance, flexible data fetching, and built-in optimizations. With features including server-side rendering (SSR), static site generation (SSG), API routes, and dynamic routing, Next.js makes it easier than ever to create sleek, scalable, and high-performing apps—without the headache. As with all Scrimba courses, we’ll be getting very hands-on with the code as we build a project called PrintForge—a site for browsing and sharing STL files which are used in 3D printing. This course covers everything you need to get started with Next.js. Whether you're a front-end developer looking to expand your skill set or a fullstack developer aiming to streamline your workflow, this course will enable you to build high-performance web apps that users (and search engines) love.
-
This beginner-friendly course is your fast track to learning the fundamentals of Node.js, the powerful JavaScript runtime built on Chrome's V8 engine. Through a hands-on, project-based approach, learners will start with a solid introduction to Node.js and gradually progress onto building and serving web content using core modules such as http. Along the way, you’ll explore the request-response cycle, handle routing, serve JSON APIs, and implement key backend functionalities such as path parameters, query strings, and CORS (Cross-Origin Resource Sharing). The course breaks down technical concepts into easy-to-follow lessons, including practical asides that cover critical backend topics including HTTP, JSON, and modular code design. You'll build confidence as you go, writing actual server-side code and learning how to organize and refactor it effectively. By the end of the course, you'll not only understand how Node.js works under the hood but also have a mini server application that demonstrates real-world concepts used in backend development.
-
Unlock the full potential of your computer with this beginner-friendly course on the command line (CLI). Whether you're a developer, data analyst, or just curious about tech, this course will help you confidently interact with your system using text-based commands. You'll start by understanding what the command line is and why it's useful, before covering real-world tasks including navigating files and directories, creating and deleting files, and manipulating text-based data. Each lesson is short, focused, and interactive, making it easy to absorb and apply what you learn right away. A final Graded Assignment helps solidify your knowledge and prepare you for using the command line in real scenarios. By the end, you’ll no longer rely solely on your mouse. You’ll move through your system like a pro, with speed and precision.
-
Discover how to build efficient, data-driven applications using SQL, the essential database language. In this interactive Scrimba course, you'll write SQL queries against the database of a retro car store, solving practical coding challenges and improving your muscle memory as you go. In Section One, you’ll discover the core building blocks of SQL by writing real queries against real data. You’ll cover everything from SELECT statements and filtering with WHERE, to sorting, grouping, and basic data manipulation with INSERT, UPDATE, and DELETE. Section Two goes beyond single-table queries. You’ll learn how to work with relational data, including creating and modifying tables, populating them with data, and using different types of joins to combine data across tables. Finally, Section Three introduces more advanced logic, showing you how to use ANY, ALL, and EXISTS for powerful subqueries, and how to apply CASE expressions in SELECT, WHERE, and UPDATE clauses to create dynamic, flexible queries. By the end, you’ll have built a solid foundation in SQL and developed the skills to work effectively with real-world databases.
-
Learn Express.js is an engaging and beginner-friendly course designed to give you a solid foundation in building web servers using Node.js and the Express framework. You'll start by setting up a basic server, understanding the request/response cycle, and sending responses. As you progress, you'll dive deeper into serving data, using query parameters, and adding path parameters to routes. The course also teaches modularizing code using express.Router(), handling "Route Not Found" errors, and configuring CORS to manage cross-origin requests. Practical examples and clear explanations help ensure you can build organized, maintainable backend applications. By the end, you’ll be ready to build your own Express.js projects confidently and efficiently, equipped with best practices and real-world knowledge. This course is project-based, so you’ll learn by building two exciting apps: 1. Startup Planet: A REST API packed with detailed information about startups from around the world. You'll learn how to: - Create routes to serve different types of data - Handle HTTP requests and responses - Serve and filter data using Express 2. Spiral Sounds: An indie rock vinyl store where users can browse, order, and get real-time updates. You'll build features including: - User authentication and protected routes - Inventory management and order processing - Task queues for simulating logistics - Real-time notifications using Server-Sent Events
Taught by
Ajo Borgvold, Bob Ziroll, Dylan Israel, Fredrik Ridderfalk, Gary Simon, Gregor Thomson, Kevin Powell, Per Harald Borgen, Rachel Johnson and Tom Chant