100 Days Of Code - 2024 Web Development Bootcamp from Udemy

Join the most comprehensive web development bootcamp on Udemy.

This course teaches you web development and turns you into a web developer in 100 days - or allow you to refresh key essentials and expand your existing knowledge.

Becoming a web developer is a great choice because web development opens up many career paths and web development skills are required in pretty much every business that exists today - and of course this demand will increase in the future.

It's not just about websites - it's also about "behind the scenes" services used by mobile apps like Uber or AirBnB. It's about rich web apps like Google Docs as well as browser games. And of course also about regular websites like Facebook, online blogs, online shops like Amazon and much, much more.

Hence it's no wonder, that web developers are in high demand. And, besides great job perspectives, as a web developer, you can of course also easily build your own digital business.

This Course Is For You.

This course will teach you web development from the ground up and thanks to the "100 Days Of Code Challenge" which is incorporated into this course (though it's optional to commit to it. ), you can become a web developer in 100 days with help of this course.

No prior web development knowledge is required at all to get started with this course. We will explore all important basics, all fundamentals and all key concepts together, step by step.

But this course is also for advanced students who already do have web development knowledge. It's a deep-dive course and hence you will be able to expand your existing knowledge by diving deeper into key fundamentals like

Since it's a huge course, the course is built in a modular way. This means, that you can take it step by step, lecture by lecture but you can also jump right into the course sections that are most interesting to you. Of course, we recommend the "step-by-step" approach for beginners - simply because all the lectures and sections build up on each other. But as a more experienced developer, you can of course skip basics that aren't interesting to you.

The 100 Days Of Code Challenge

We built this course with the "100 Days Of Code Challenge" in mind - a challenge (not invented by us) that aims to keep you motivated to code for at least 1 hour per day for 100 days.

Since this is a huge course (with around 80 hours of content. ) it can be very overwhelming. And we know that many students never finish a course.

That's a pitty, because this course is packed with content, exercises, quizzes, assignments and demo projects. We build a browser-game, a blog, a travel website, an online shop and much, much more.

Therefore, we provide clear guidance on how you can take this course from A to Z within 100 days by spending 1 to 2 hours per day watching videos and learning. As part of the course, you get access to a companion website that provides a clear structure and you also find annotations right in the course curriculum.

Of course taking this "100 Days" challenge is totally optional though. You can take the course at your own pace as well and skip any content you're not interested in.

Try It Risk-Free

This course comes with a 30 day money-back guarantee. If you find out that it's not for you, you can get your money back, no questions asked.

What You Will Learn

This is a huge course, packed with content and it's the web development bootcamp we would have loved to have when we learned web development.

Here's a summary of the key concepts we'll explore as part of this course:

How the web works
Core technologies: HTML, CSS & JavaScript
Understand how HTML documents are structured and how HTML elements are used correctly
Learn core CSS concepts like the box model, flexbox, positioning, units and much more
Explore advanced CSS concepts like building responsive websites, layouts, custom CSS properties, CSS grid & more
Learn browser-side JavaScript from the ground up
Understand what the "DOM" is and how you can manipulate it via JavaScript
Explore browser / user events and how to handle them with JavaScript
Build tons of projects (e.g. a Tic-Tac-Toe browser game) to practice and fully understand all these technologies
Dive into backend development with NodeJS & ExpressJS
Learn what NodeJS is and how it works
Build basic backend-driven websites with advanced concepts like dynamic routing or dynamic templates
Learn how to work with databases - SQL & NoSQL (and what that is)
Practice how to use SQL / NoSQL with NodeJS & Express
Dive into advanced concepts like authentication, website security, coding patterns, file uploads, user input validation and so much more.
Again: Build plenty of projects (e.g. a complete online shop, from the ground up. ) to practice all advanced concepts as well
Learn how to use third-party packages and services (e.g. Stripe for payments) in your websites
Move on to more specialized, advanced concepts like building REST APIs
Explore frontend JavaScript frameworks like Vue.js to build even more powerful web user interfaces
And so much more - simply check out the full curriculum to get a complete list.

We'd love to start this journey with you, so let's get started.

Max & Manuel

What's inside

Learning objectives

How the web works and how to get started as a web developer
Learn web development in 100 days (optional - you can also pick a different pace)
Build websites, web apps and web services (and understand what these "things" are)

Build frontend user interfaces with html, css & javascript
Build backend processes with nodejs, express & sql + nosql databases
Add advanced features like user authentication, file upload or database queries to websites

How the web works and how to get started as a web developer
Learn web development in 100 days (optional - you can also pick a different pace)
Build websites, web apps and web services (and understand what these "things" are)
Build frontend user interfaces with html, css & javascript
Build backend processes with nodejs, express & sql + nosql databases
Add advanced features like user authentication, file upload or database queries to websites

Syllabus

Get started with this course and learn what web development is, what this course offers and learn about the different ways of taking this course!

Welcome to This Course! [Day 1]

What Is "Web Development" & How Does The Web Work? [Day 1]

The Three Key Programming Languages [Day 1]

How The Web Works: A Deep Dive [Day 1]

What About The "www"? [Day 1]

The 100 Days of Code Challenge! [Day 1]

How To Get The Most Out Of This Course [Day 1]

Stuck in the Course? We Got you Covered! [Day 1]

Join Our Learning Community!

How To Use The Attached Code [Day 1]

Building websites is all about using HyperText Markup Language (HTML) to structure and display your content and Cascading Style Sheets (CSS) for styling that content. This section dives into both!

Module Introduction [Day 1]

How to Create a Website [Day 1]

Creating our First HTML Page [Day 1]

Setting Up a Development Environment [Day 2]

Why Visual Studio Code? [Day 2]

Understanding HTML Elements [Day 2]

Which HTML Elements Exist? [Day 2]

Adding Another HTML Element [Day 2]

Exploring HTML Attributes [Day 2]

Every website is built with HTML. It defines and describes the content and structure of your page. Time to check your knowledge!

Getting Started with CSS (Day 2)

More CSS Styling [Day 2]

Working with Colors [Day 3]

Formatting our Code [Day 3]

Working with the Browser Developer Tools [Day 3]

Adding a Link [Day 3]

You can Nest HTML Elements! [Day 3]

Using Global CSS Styles [Day 3]

CSS Code Formatting [Day 3]

The HTML Document Skeleton & Metadata [Day 3]

Visual Studio Code Shortcuts & Tricks [Day 3]

Code Comments [Day 3]

First Summary [Day 3]

Learning Check: HTML & CSS Basics [Day 3]

Styling the Anchor Element Also with Pseudo Hover [Day 4]

Why it's Called Cascading Style Sheets [Day 4]

Storing CSS Code in External Files [Day 4]

The Void Element Syntax [Day 4]

Multiple Files & Requests [Day 4]

Selecting Single Elements with the ID Selector [Day 4]

Working with "font-size" and "px" [Day 4]

Using Other Fonts from Google Fonts [Day 4]

Understanding How HTML & CSS Handle Text & Whitespace [Day 5]

Adding an Image [Day 5]

Styling the Image & Using the Body Tag [Day 5]

Styling the Overall Page Background [Day 5]

Adding a Second HTML File [Day 5]

A Word About File Name Conventions [Day 5]

Learning Check: More HTML & CSS Features [Day 5]

Time to Practice - Your First Challenge! [Day 5]

Using a Shared CSS File [Day 5]

Organizing Source Files in Folders [Day 5]

Summary [Day 5]

The basics are set, but there is a lot more to discover. In this section, students will learn about HTML elements like lists, explore the CSS box model and understand CSS concepts like specificity.

Module Introduction [Day 6]

Using the Live Server Extension [Day 6]

The Development Server & The Local Website Address [Day 6]

Understanding Lists [Day 6]

Creating Lists [Day 6]

Understanding Parents, Children, Containers & More [Day 6]

Understanding Cascading, Inheritance & Specificity [Day 6]

Styling the Full Week Page [Day 6]

Introducing the CSS Box Model [Day 7]

Using the CSS Box Model [Day 7]

Creating HTML Layouts [Day 7]

Theory: Selectors & Combinators [Day 7]

Using Selectors & Combinators [Day 7]

Understanding Classes [Day 7]

Block vs Inline Elements [Day 7]

Styling Differences Between Block & Inline Elements [Day 8]

Understanding Margin Collapsing [Day 8]

The "box-shadow" Property [Day 8]

Your Challenge! [Day 8]

Creating the HTML Layout [Day 8]

Styling the Main Section [Day 8]

Styling Images & Working with Negative Margins [Day 8]

Finishing Touches [Day 8]

Module Summary [Day 8]

A List Of All CSS Selectors [Day 8]

Are you ready to practice what we learned? In this module, students will revise the concepts of the last modules in a new project from scratch!

Module Introduction [Day 9]

Your Task! [Day 9]

Creating the Core Structure [Day 9]

Adding the Header Content [Day 9]

Adding Header Styling [Day 9]

Spacing & the CSS Box Model [Day 9]

Adding the Main Content [Day 9]

Styling the Main Content [Day 10]

Styling List Items & Links [Day 10]

Adding the Footer [Day 10]

Introducing New HTML Elements [Day 10]

Organizing our Files [Day 10]

Module Summary [Day 10]

Learn how to take the first website(s) you built and expose it to other users by moving it onto your own server.

Module Introduction [Day 11]

What is "Hosting" & "Deployment"? [Day 11]

Hosting a First Static Website (Example Deployment on Netlify) [Day 11]

More Information On Netlify & HTTPS [Day 11]

Good to know

Know what's good

, what to watch for

, and possible dealbreakers

Explores industry-standard HTML, CSS, and JavaScript

Provides a comprehensive introduction to web development

Teaches students how to build responsive and interactive websites, web apps, and web services

Taught by experienced instructors with a proven track record of teaching web development

Includes hands-on exercises and projects to help students apply their knowledge

Suitable for both beginners and experienced students

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in 100 Days Of Code - 2024 Web Development Bootcamp with these activities:

Review basic HTML and CSS concepts

Show steps

Refreshes the fundamental knowledge of HTML and CSS, which are essential for building websites.

Browse courses on HTML

Show steps

Revisit the basics of HTML elements and their attributes.
Review the core concepts of CSS, including selectors, properties, and values.
Practice creating simple web pages using HTML and CSS.

Solve HTML and CSS coding challenges

Show steps

Strengthens the understanding of HTML and CSS through hands-on practice, improving coding skills.

Browse courses on HTML

Show steps

Find coding challenges or exercises online or in books.
Attempt to solve the challenges using the concepts learned in the course.
Review the solutions and identify areas for improvement.

Attend weekly study sessions with classmates

Show steps

Provides opportunities for students to engage with each other, ask questions, and reinforce their understanding of course material.

Browse courses on Collaboration

Show steps

Find a group of classmates who are interested in regular study sessions.
Establish a regular time and place for the sessions.
Take turns presenting concepts, discussing assignments, and solving problems together.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Create a simple personal website

Show steps

Provides practical experience in applying HTML, CSS, and JavaScript to build a functional website.

Browse courses on Web Development

Show steps

Plan and design the website's layout and content.
Develop the website using HTML and CSS for structure and style.
Add basic JavaScript for interactivity and functionality.
Test and debug the website to ensure it functions correctly.
Deploy the website on a hosting platform.

Develop an interactive data visualization

Show steps

Challenges students to apply their web development skills to create compelling and informative data visualizations.

Browse courses on Data Visualization

Show steps

Gather and prepare data for visualization.
Choose appropriate data visualization techniques and tools.
Design and implement the interactive visualization.
Test and refine the visualization for usability and effectiveness.
Present the visualization to an audience.

Follow tutorials on advanced JavaScript techniques

Show steps

Enhances JavaScript skills by exploring advanced concepts and techniques through guided tutorials.

Browse courses on JavaScript

Show steps

Identify specific JavaScript techniques or concepts to improve upon.
Find high-quality tutorials or courses that cover these techniques.
Follow the tutorials step-by-step and implement the techniques.
Experiment with the techniques in personal projects or exercises.

Contribute to an open-source web development project

Show steps

Provides real-world experience in web development and fosters collaboration with the open-source community.

Browse courses on Open Source

Show steps

Identify an open-source web development project of interest.
Understand the project's codebase and contribution guidelines.
Make meaningful contributions to the project, such as fixing bugs or adding features.
Collaborate with other contributors and maintainers.
Seek feedback and guidance from experienced contributors.

Career center

Learners who complete 100 Days Of Code - 2024 Web Development Bootcamp will develop knowledge and skills that may be useful to these careers:

Web Developer

Web developers are responsible for the design, maintenance, and improvement of websites and web applications. They ensure that these applications work correctly and seamlessly across devices.

See salaries and explore the career path for Web Developer

UX Designer

UX designers are responsible for designing the user interface and user experience of websites and web applications. This course may be helpful in developing the skills necessary to become a UX designer, including HTML, CSS, and JavaScript.

See salaries and explore the career path for UX Designer

Front-End Web Developer

Front-end web developers are responsible for designing and coding the front end of a website, including the user interface and the user experience. This course can provide students with the skills necessary to become a front-end web developer, including HTML, CSS, and JavaScript.

See salaries and explore the career path for Front-End Web Developer

Full-Stack Developer

Full-stack developers are responsible for all aspects of web development, from the front end to the back end. This course may provide students with a solid foundation in full-stack development, including HTML, CSS, JavaScript, NodeJS, and ExpressJS.

See salaries and explore the career path for Full-Stack Developer

Technical Writer

Technical writers are responsible for creating and maintaining documentation for software and hardware products. This course may help students develop the skills necessary to become a technical writer, including writing skills, technical knowledge, and project management.

See salaries and explore the career path for Technical Writer

Quality Assurance Tester

Quality assurance testers are responsible for testing software and hardware products to ensure that they meet quality standards. This course may help students develop the skills necessary to become a quality assurance tester, including testing techniques, software testing tools, and problem-solving.

See salaries and explore the career path for Quality Assurance Tester

Database Administrator

Database administrators are responsible for the management and maintenance of databases. This course may help students develop the skills necessary to become a database administrator, including SQL and NoSQL databases.

See salaries and explore the career path for Database Administrator

Project Manager

Project managers are responsible for planning, executing, and closing out projects. This course may help students develop the skills necessary to become a project manager, including project planning, risk management, and team management.

See salaries and explore the career path for Project Manager

Systems Engineer

Systems engineers are responsible for designing, implementing, and maintaining computer systems and networks. This course may provide students with a solid foundation in systems engineering, including HTML, CSS, JavaScript, and NodeJS.

See salaries and explore the career path for Systems Engineer

Software Engineer

Software engineers are responsible for designing, developing, testing, and maintaining software applications. This course may help students develop the skills necessary to become a software engineer, including problem-solving, analytical thinking, and software development skills.

See salaries and explore the career path for Software Engineer

Business Analyst

Business analysts are responsible for analyzing business needs and identifying solutions to improve business processes. This course may be helpful in developing the skills necessary to become a business analyst, including data analysis, process improvement, and systems analysis.

See salaries and explore the career path for Business Analyst

Sales Engineer

Sales engineers are responsible for selling and supporting technical products and services. A course like this may help students develop the skills necessary to become a sales engineer, including product knowledge, technical skills, and sales skills.

See salaries and explore the career path for Sales Engineer

Product Manager

Product managers are responsible for managing the development and launch of new products. A course like this may help students develop the skills necessary to become a product manager, including project management, market research, and product development.

See salaries and explore the career path for Product Manager

Information Security Analyst

Information security analysts are responsible for protecting an organization's computer systems and networks from cyber threats. This course can be helpful for students who wish to pursue a career in information security.

See salaries and explore the career path for Information Security Analyst

Data Analyst

Data analysts are responsible for collecting, analyzing, and interpreting data to identify trends and patterns. A course like this can be helpful in developing the skills necessary for a career in data analysis.

See salaries and explore the career path for Data Analyst