Cademy logoCademy Marketplace

Course Images

Full Stack Web Development Mastery Course - Novice to Expert

Full Stack Web Development Mastery Course - Novice to Expert

  • 30 Day Money Back Guarantee
  • Completion Certificate
  • 24/7 Technical Support

Highlights

  • On-Demand course

  • 3 days

  • All levels

Description

Learn modern frameworks and technologies, including JavaScript ES6, Bootstrap 5, Tailwind CSS, React, MongoDB, Express, and Nodejs. It's a step-by-step guide to building powerful web applications using cutting-edge technologies for your start-up or business. Learn powerful skills that will make you invaluable in the job market with no coding knowledge.

Full stack development refers to the development of both frontend (client-side) and backend (server-side) portions of the web application. Full-stack web developers have the ability to design complete web applications and websites. They work on the frontend, backend, database, and debugging of web applications or websites. You will start with learning about HTML and CSS along with some basic concepts of web development. Then you will look at Bootstrap and Tailwind CSS, and build two different projects using them. After that, you will jump on to learn about JavaScript and JSON, followed by two different projects from scratch. You will then learn in-depth about jQuery, Node, Express, and MongoDB+ Mongoose. With these, you will complete your frontend and backend journey together. After that, you will learn about Restful APIs and explore how to create your own REST API and use Git/GitHub. Finally, you will be looking at various hosting websites for hosting purposes. The author uses analogies to teach you about the different components of web development. By the end of this course, you will be able to create successful, beautiful, and profitable websites. Get hired as a web developer post adding these projects, and master the MERN stack from scratch. All the resource files are added to the GitHub repository at: https://github.com/PacktPublishing/Full-Stack-Web-Development-MASTERY-Course---Novice-to-Expert

What You Will Learn

Explore the modern frameworks, libraries, tools, and technologies
Learn to build a basic website using bootstrap 5
Build a Facebook login page using HTML, CSS, and Tailwind CSS
Build a Slither game using JavaScript
Build a Chrome extension using JSON
Learn professional developer best practices

Audience

The course is designed keeping in mind absolute beginners with no coding experience. This course is ideal for the ones who are interested in learning to code and build websites and web apps, starting a career in web development, or the ones who want to start their own business. This course can be followed by someone who knows HTML, CSS, and JavaScript.

No coding or web development knowledge is needed; you will start from scratch. A computer (Windows/Mac/Linux) with access to the Internet is the only thing required. All tools and software used in this course will be free and downloaded to be used.

Approach

This is comprehensive, highly practical, and has very easy-to-follow and comprehensive instructions. You will look at the basic concepts at the beginning, followed by some advanced topics. It will teach everything from scratch, right from installing your IDE to demonstrating complex operations till the very end. The course is made up of many modules; each module is a self-contained course.

Key Features

This comprehensive course covers a massive and insane number of tools, technologies, and frameworks * Learn core concepts of both the frontend and backend programming from scratch * Packed with resources including website templates, UI components, and much more

Github Repo

https://github.com/PacktPublishing/Full-Stack-Web-Development-MASTERY-Course---Novice-to-Expert

About the Author

Prerak Mehta

Prerak Mehta is a passionate web developer and teacher. He is fond of adding value to people's lives. His first exposure to programming was when he was in high school and always wanted to develop new video games. As he tried to dig deep and self-explore game development, he started to realize that programming is much more demanding. He understood that conventional teaching techniques were extremely tricky, making it very difficult to understand even the basic concepts. This inspired him to create programming and development-related courses that involve innovative teaching techniques. His courses will improve the learner's understanding of the most difficult concepts with ease and will be fun to learn coding with the help of practical examples.

Course Outline

1. What Does the Course Cover?

1. What Does the Course Cover?

This video helps with the course's coverage and its structure.

2. Asking Great Questions and Debugging Your Code

This video helps you with the solutions of how to debug the code, find solutions online, and the ways to ask good/specific questions.


2. Getting Started

1. Introduction to Web Development

This video provides an introduction to web development.

2. Static Versus Dynamic Websites

This video talks about static and dynamic websites.

3. Visual Studio Code Installation

This video shows the installation of the Visual Studio code from scratch.


3. HTML 5 (Zero to Hero)

1. Basic Structure of a Website

This video provides you with the basic structure of a website.

2. Comments and Best Practices

This video talks about the comments and best practices to be followed.

3. All Basic HTML Tags

This video demonstrates all basic HTML tags.

4. Anchor, Image, Video, iframe Tags in HTML

This video explains the anchor, image, video, iframe tags in HTML.

5. Lists and Tables in HTML

This video explains lists and tables in HTML.

6. Forms and Input Tags in HTML

This video explains forms and input tags in HTML.

7. Block and Inline Elements in HTML

This video explains about block and inline elements in HTML.

8. HTML Entities

This video explains HTML entities.

9. SEO and Semantic Tags in HTML

This video talks about SEO and semantic tags in HTML.


4. CSS 3 (Zero to Hero)

1. Introduction to CSS

This video provides an introduction to CSS.

2. Inline, Internal, and External

This video talks about inline, internal, and external CSS types.

3. CSS Selectors

This video talks about CSS selectors.

4. Web Development Tools

This video talks about web development tools.

5. Fonts in CSS

This video explains how to change fonts in CSS.

6. Colors in CSS

This video explains how to change colors in CSS.

7. Borders and Background Property in CSS

This video talks about the borders and background property in CSS.

8. Understanding Box Model Concept in CSS

This video helps in understanding the box model concept in CSS.

9. Float and Clear Property in CSS

This video explains the float and clear property in CSS.

10. Styling Buttons and Links

This video helps you with styling buttons and links.

11. Display Property in CSS

This video talks about the display property in CSS.

12. Position Property in CSS

This video demonstrates the position property in CSS.

13. Visibility and Z-Index Property in CSS

This video talks about visibility and Z-index property in CSS.

14. Understanding Flexbox Concept in CSS

This video helps in understanding the Flexbox concept in CSS.

15. Sizing and Units in CSS

This video explains sizing and units in CSS.

16. Responsive and Media Queries in CSS

This video helps you with responsive and media queries in CSS.

17. Box Shadow and Text Shadow in CSS

This video talks about the box shadow and text shadow in CSS.

18. Custom Properties and Variables

This video helps you with custom properties and variables.

19. All About Animation in CSS

This video talks about the animation in CSS.

20. Transitions in CSS

This video explains the transitions in CSS.

21. Transformations in CSS

This video explains the transformations in CSS.

22. All About CSS Grids

This video talks about CSS grids in detail.


5. Bootstrap 5 (Zero to Hero)

1. Bootstrap 101

This video helps you get introduced to Bootstrap from scratch.


6. #1 Project: Bootstrap Website

1. Bootstrap Project

This video will help you make your first project on Bootstrap.


7. Tailwind CSS (Zero to Hero)

1. Introduction to Tailwind CSS

This video provides an introduction to Tailwind CSS.

2. Setting Up Tailwind CSS for Production

This video helps you with setting up Tailwind CSS for production.

3. Fonts and Sizing Using Tailwind CSS

This video explains how to update fonts and sizing using Tailwind CSS.

4. Margins, Borders, and Padding in Tailwind CSS

This video talks about changing the margins, borders, and padding in Tailwind CSS.

5. Square Bracket Notation in Tailwind CSS

This video talks about the square bracket notation in Tailwind CSS.

6. Creating Responsive Designs Using Tailwind CSS

This video demonstrates creating responsive designs using Tailwind CSS.

7. Hover, Active, and Focus States in Tailwind CSS

This video explains hover, active, and focus states in Tailwind CSS.

8. @apply Directive in Tailwind CSS

This video explains @apply directive in Tailwind CSS.

9. @layer Directive in Tailwind CSS

This video explains @layer directive in Tailwind CSS.

10. Customizing Tailwind CSS

This video demonstrates customizing Tailwind CSS.


8. #2 Project: Facebook Login Page

1. Tailwind CSS Project

This video will help you create a project with Tailwind from scratch.


9. JavaScript ES6 (Zero to Hero)

1. Introduction to JavaScript

This video provides an introduction to JavaScript.

2. Basics of JavaScript

This video talks about the basics of JavaScript.

3. Var, Const, Let in JavaScript

This video explains Var, Const, and Let in JavaScript.

4. Data Types in JavaScript

This video talks about the data types in JavaScript.

5. Conversion and Coercion

This video explains conversion and coercion.

6. All about JavaScript Strings

This video explains JavaScript strings in detail.

7. All about Arrays

This video explains arrays in detail.

8. Conditionals and Switch Case

This video talks about conditionals and switch case.

9. Loops in JavaScript

This video explains loops in JavaScript.

10. Functions in JavaScript

This video explains functions in JavaScript.

11. Window Object Properties and Functions

This video explains the window object properties and functions.

12. Basics of DOM

This video talks about the basics of DOM.

13. HTML Element Selectors in JavaScript

This video explains HTML element selectors in JavaScript.

14. Children Parent and Traversing the DOM

This video explains what children parent is and talks about traversing the DOM.

15. Creating, Removing, and Replacing Elements

This video is about creating, removing, and replacing elements.

16. JavaScript Events and Event Handlers

This video explains JavaScript events and event handlers.

17. More on JavaScript Events

This video focuses in depth on JavaScript events.

18. Local and Session Storage

This video talks about local and session storage.

19. Math Object in JavaScript

This video explains the math object in JavaScript.

20. Date Object in JavaScript

This video talks about the date object in JavaScript.

21. Object-Oriented Programming (OOP) in JavaScript

This video explains Object-Oriented Programming (OOP) in JavaScript.

22. Object Prototype in JavaScript

This video explains the object prototype in JavaScript.

23. Prototype Inheritance

This video explains prototype inheritance.

24. ES6 Classes and Inheritance

This video is about ES6 classes and inheritance.

25. Asynchronous Programming in JavaScript

This video talks about asynchronous programming in JavaScript.

26. AJAX Tutorial

This video is a tutorial on AJAX.

27. Callback Functions in JavaScript

This video is about callback functions in JavaScript.

28. Promises in JavaScript

This video explains Promises in JavaScript.

29. Arrow Functions

This video talks about the Arrow functions.

30. Fetch API

This video is about the Fetch API.

31. Async / Await in JavaScript

This video explains Async / Await in JavaScript.

32. Error Handling in JavaScript

This video is about error handling in JavaScript.

33. Regular Expressions in JavaScript

This video talks about regular expressions in JavaScript.

34. Metacharacters in JavaScript

This video explains the metacharacters in JavaScript.

35. Character Sets in Regular Expressions

This video explains the character sets in regular expressions.

36. Iterators in JavaScript

This video talks about iterators in JavaScript.

37. Generators in JavaScript

This video is about generators in JavaScript.

38. Maps in JavaScript

This video explains maps in JavaScript.

39. Sets in JavaScript

This video talks about sets in JavaScript.

40. Symbols in JavaScript

This video explains symbols in JavaScript.

41. Destructing in JavaScript

This video explains how to destruct in JavaScript.


10. #3 Project: Slither Game

1. Slither/Snake Game Using JavaScript

This video will help you build a Slither/Snake game using JavaScript.


11. JSON (Zero to Hero)

1. JSON 101

This video explains the concept of JSON from scratch.


12. #4 Project: Chrome Extension

1. Make Your Own Chrome Extension!

This video will help you make your own Chrome extension from scratch.


13. jQuery (Zero to Hero)

1. jQuery 101

This video talks about jQuery from scratch.


14. React.js (Zero to Hero)

1. Introduction and Installation

This video provides an introduction and helps with the installation.

2. create-react-app

This video talks about the create-react-app to create the run project easily.

3. Understanding JSX

This video helps in understanding JSX (JavaScript XML).

4. Creating React App with Bootstrap

This video helps in creating a react app with Bootstrap.

5. Props and PropTypes

This video explains Props and PropTypes.

6. States and Events in React App

This video explains the states and events in the React app.

7. Creating Dark Mode for React App

This video helps in creating a dark mode for the React app.

8. Changing Title, Favicon, Meta of React App

This video helps in changing the title, favicon, and meta of the React app.

9. React Router

This video explains the React router.

10. Introduction to Class-Based Component

This video provides an introduction to the class-based component.

11. Structure of Our React Application

This video helps you with the structure of our React application.

12. Fetch API Key in React App

This video explains the Fetch API key in the React app.

13. States and Props in Class Components

This video explains states and props in class components.

14. Iterating Array in JSX

This video explains the iterating array in JSX.

15. Using Fetch API in React to Populate Data

This video helps in using the Fetch API in React to populate data.

16. Adding Pagination to React App

This video talks about adding pagination to the React app.

17. Adding Loading Spinner to React App

This video helps in adding loading spinner to the React app.

18. Adding Categories and PropTypes in React App

This video talks about adding categories and PropTypes in the React app.

19. React Router in Class-Based App

This video uses the React router in the class-based app.

20. Restructuring the Code

This video demonstrates restructuring the code.

21. Infinite Scroll in React

This video explains infinite scroll in React.

22. React Top Loading Bar

This video explains the React top loading bar.

23. Changing Class-Based to Function-Based

This video explains how to move from class-based to function-based.


15. Node.js + NPM (Zero to Hero)

1. Introduction to Node.js

This video provides an introduction to Node.js.

2. Node.js Installation and REPL

This video demonstrates the installation of Node.js and REPL (Read Evaluate Print Loop).

3. Node.js Core Modules

This video explains the Node.js core modules.

4. Synchronous CRUD Operations Using FS Modules

This video explains synchronous CRUD operations using FS modules.

5. Node.js Asynchronous File System Core Modules

This video talks about the Node.js asynchronous file system core modules.

6. Synchronous Versus Asynchronous in Node.js

This video explains the difference between synchronous and asynchronous in Node.js.

7. Asynchronous CRUD Operations Using FS Modules

This video demonstrates asynchronous CRUD operations using FS modules.

8. OS Module in Node.js

This video explains the OS module in Node.js.

9. Path Module in Node.js

This video talks about the Path module in Node.js.

10. Create and Export Your Own Modules in Node.js

This video helps create and export your own modules in Node.js.

11. Complete NPM Tutorial

This video is a complete tutorial on NPM from scratch.

12. Nodemon in Node.js

This video explains Nodemon in Node.js.

13. Module Wrapper Function in Node.js

This video talks about the Module wrapper function in Node.js.

14. Creating HTTP Server in Node.js

This video helps in creating an HTTP server in Node.js.

15. Routing in Node.js

This video talks about routing in Node.js.

16. JSON in Node.js

This video is about JSON and its use in Node.js.

17. Create Simple API in Node.js

This video helps create a simple API in Node.js.

18. Event Modules in Node.js

This video explains Event modules in Node.js.

19. Streaming in Node.js

This video covers streaming in Node.js.

20. Stream Pipes in Node.js

This video explains stream pipes in Node.js.


16. Express.js + HBS (Zero to Hero)

1. Introduction to Express.js

This video provides an introduction to Express.js.

2. Routing in Express.js

This video explains routing in Express.js.

3. Sending HTML and JSON Data Using Express.js

This video helps in sending HTML and JSON data using Express.js.

4. Serving Static Website Using Express.js

This video is about serving a static website using Express.js.

5. Template Engines

This video demonstrates the Template engines.

6. Views Directory in Express.js

This video explains the Views Directory in Express.js.

7. Partials in Express.js

This video explains Partials in Express.js.

8. Adding 404-Page Using Express.js

This video helps in adding a 404-page using Express.js.

9. Query Strings in Express.js

This video explains query strings in Express.js.

10. Express.js and API

This video talks about Express.js and API in detail.


17. MongoDB + Mongoose (Zero to Hero)

1. Introduction to MongoDB

This video provides an introduction to MongoDB.

2. Installation of MongoDB

This video demonstrates the installation of MongoDB.

3. Basic Fundamentals of MongoDB

This video explains the basic fundamentals of MongoDB.

4. Create Data in MongoDB (CRUD Series)

This video helps create data in MongoDB (CRUD series).

5. Read Data in MongoDB (CRUD Series)

This video talks about reading data in MongoDB (CRUD series).

6. Update Data in MongoDB (CRUD Series)

This video explains how to update data in MongoDB (CRUD series).

7. Delete Data in MongoDB (CRUD Series)

This video explains how to delete data in MongoDB (CRUD series).

8. MongoDB Compass Installation

This video demonstrates the installation of MongoDB Compass.

9. CRUD in One Minute Using MongoDB Compass

This video explains CRUD in a minute using MongoDB Compass.

10. Introduction to Mongoose

This video provides an introduction to Mongoose.

11. Mongoose Schema and Models

This video explains Mongoose schema and models.

12. Create and Insert Documents Using Mongoose (CRUD Series)

This video helps create and insert documents using Mongoose (CRUD series).

13. Insert Multiple Documents Using Mongoose (CRUD Series)

This video helps insert multiple documents using Mongoose (CRUD series).

14. How to Read Documents Using Mongoose (CRUD Series)

This video explains how to read documents using Mongoose (CRUD series).

15. Query Methods and Operators

This video explains query methods and operators.

16. Update Documents Using Mongoose (CRUD Series)

This video helps update documents using Mongoose (CRUD series).

17. Delete Documents Using Mongoose (CRUD Series)

This video helps delete documents using Mongoose (CRUD series).

18. Mongoose Built-In Validation

This video explains Mongoose built-in validation.

19. Creating Your Own Validator in Mongoose

This video helps in creating your own validator in Mongoose.

20. NPM Validator Package

This video explains the NPM validator package.


18. REST APIs

1. Introduction to REST API and POSTMAN

This video provides an introduction to REST API and POSTMAN.

2. Creating Your Own RESTful API

This video helps in creating your own RESTful API.

3. Building REST API with Asynchronous Function

This video helps in building REST API with an asynchronous function.

4. Handling GET Request in Our API

This video is about handling a GET request in our API.

5. Handling PATCH Request in Our API

This video is about handling a PATCH request in our API.

6. Handling DELETE Request in Our API

This video explains handling a DELETE request in our API.

7. Adding Express Router in Our API

This video helps in adding an express router to our API.


19. Git and GitHub

1. Git and GitHub in One Lecture

This video explains in detail about Git and GitHub.


20. Hosting Websites

1. Hosting and Deploying Tutorial

This video is a complete tutorial on hosting and deploying your website.

Course Content

  1. Full Stack Web Development Mastery Course - Novice to Expert

About The Provider

Packt
Packt
Birmingham
Founded in 2004 in Birmingham, UK, Packt’s mission is to help the world put software to work in new ways, through the delivery of effective learning and i...
Read more about Packt

Tags

Reviews