Packt

Front-End Web Developer Bootcamp - HTML, CSS, JS, & React

Packt

Front-End Web Developer Bootcamp - HTML, CSS, JS, & React

包含在 Coursera Plus

深入了解一个主题并学习基础知识。
初级 等级

推荐体验

2 周 完成
在 10 小时 一周
灵活的计划
自行安排学习进度
深入了解一个主题并学习基础知识。
初级 等级

推荐体验

2 周 完成
在 10 小时 一周
灵活的计划
自行安排学习进度

您将学到什么

  • Learn how to structure and design webpages with HTML5 and CSS3

  • Gain hands-on experience in JavaScript and React for building interactive user interfaces

  • Master responsive design techniques using CSS3 media queries, Flexbox, and Grid

  • Understand how to work with APIs and build dynamic, data-driven web applications

要了解的详细信息

可分享的证书

添加到您的领英档案

最近已更新!

February 2026

作业

35 项作业

授课语言:英语(English)

了解顶级公司的员工如何掌握热门技能

Petrobras, TATA, Danone, Capgemini, P&G 和 L'Oreal 的徽标

该课程共有35个模块

In this module, we will introduce HTML5 and its role in modern web development. You will explore its powerful features, such as semantic tags, multimedia support, and form enhancements. Additionally, you will learn how to set up the right tools, like Visual Studio Code, to get started with HTML5 coding.

涵盖的内容

6个视频1篇阅读材料

In this module, we will explore the basic structure of an HTML5 file, including the DOCTYPE, head, and body sections. You will learn to organize HTML projects and file structures for better efficiency. By the end, you’ll be able to create well-structured HTML files.

涵盖的内容

4个视频1个作业

In this module, we will dive into the essential building blocks of HTML5, such as heading tags, quotations, and citation tags. You'll also gain insight into using HTML attributes to customize elements and discover different ways to apply styling to HTML content.

涵盖的内容

5个视频1个作业

In this module, we will cover several key HTML5 tags, from anchor and image tags to list, table, video, and audio tags. You’ll learn how to structure and present content, whether it's text, multimedia, or data, ensuring better accessibility and functionality.

涵盖的内容

8个视频1个作业

In this module, we will guide you through the process of building an HTML5 form from scratch. You will explore various input types, attributes, and validation techniques to ensure accurate data submission from users.

涵盖的内容

5个视频1个作业

In this module, we will explore the differences between block-level and inline elements in HTML. You’ll learn how these elements impact the page layout and how to use them to organize content efficiently.

涵盖的内容

2个视频1个作业

In this concluding module, we will recap the core concepts of HTML5 covered throughout the section. You will gain a deeper understanding of its relevance in creating well-structured and dynamic web pages.

涵盖的内容

1个视频1个作业

In this module, we will introduce you to CSS3 and its crucial role in enhancing web design. You will gain an understanding of CSS3 syntax and how it can be used to style various aspects of your webpage, from layout to typography.

涵盖的内容

5个视频1个作业

In this module, we will focus on fundamental CSS3 properties that control the look and spacing of elements. You’ll learn how to manage backgrounds, borders, and dimensions, giving you control over your webpage's layout and spacing.

涵盖的内容

5个视频1个作业

In this module, we will explore CSS3's typography properties. You will learn how to control text alignment, apply decorations, and transform text to enhance its appearance and readability on your webpages.

涵盖的内容

6个视频1个作业

In this module, we will dive into advanced CSS3 selectors and properties. You’ll learn how to manipulate the layout and visibility of elements, as well as apply pseudo-classes and pseudo-elements to create interactive, styled content.

涵盖的内容

9个视频1个作业

In this module, we will cover extra CSS3 features that enhance the look of your website. You'll learn how to apply opacity, rounded corners, and shadow effects to create visually striking designs with modern flair.

涵盖的内容

3个视频1个作业

In this module, we will teach you the principles of responsive design using CSS3. You’ll explore the powerful tools of CSS Grid and Flexbox, as well as learn how to use media queries for designing websites that adapt to different screen sizes and devices.

涵盖的内容

3个视频1个作业

In this module, you will work on a mini project to apply the skills you've learned in HTML5 and CSS3. This hands-on experience will help reinforce your understanding of how to build and style dynamic webpages.

涵盖的内容

1个视频1个作业

In this module, we will introduce you to JavaScript, its history, and its vital role in web development. You’ll learn the basics of JavaScript syntax, its data types, and how to incorporate it into your HTML files for dynamic functionality.

涵盖的内容

4个视频1个作业

In this module, you will dive into variables in JavaScript, understanding how to declare, initialize, and manipulate them. You will also explore how to use console.log for debugging and inspecting your code.

涵盖的内容

3个视频1个作业

In this module, you will learn how to use different control structures in JavaScript, including conditional statements and loops. You’ll explore the syntax and application of if statements, ternary operators, and break/continue for controlling code flow.

涵盖的内容

7个视频1个作业

In this module, we will explore the various operators available in JavaScript. You will learn to perform mathematical operations, assign values to variables, and compare them for conditional evaluation.

涵盖的内容

3个视频1个作业

In this module, you will explore different types of popup boxes in JavaScript. You’ll learn how to create interactive alert, confirm, and prompt boxes that provide feedback and collect input from users.

涵盖的内容

6个视频1个作业

In this module, we will explore how events work in JavaScript. You’ll learn how to attach event listeners to HTML elements and respond to user actions like clicks, keypresses, and mouse movements.

涵盖的内容

1个视频1个作业

In this module, you will learn about JavaScript loops, such as while, do-while, and for loops. You will also explore how to use nested loops to handle complex data structures effectively.

涵盖的内容

4个视频1个作业

In this module, we will explore arrays in JavaScript. You will learn how to create and modify arrays, use powerful array methods for sorting, reversing, and filtering, and iterate over array elements with built-in functions like forEach() and map().

涵盖的内容

15个视频1个作业

In this module, we will introduce objects in JavaScript. You will learn how to define objects, access their properties, and iterate through them using the for-in loop, all while exploring the power of object-oriented programming in JavaScript.

涵盖的内容

3个视频1个作业

In this module, you will master the art of string manipulation in JavaScript. You'll explore basic and advanced string methods that allow you to search, replace, slice, and modify text data efficiently.

涵盖的内容

3个视频1个作业

In this module, you will explore JavaScript's built-in number and math methods. You'll learn to validate, manipulate, and format numbers and dates, gaining the ability to perform complex calculations and handle date/time efficiently in your projects.

涵盖的内容

4个视频1个作业

In this module, you will understand the DOM and its role in web development. You’ll learn how to access, manipulate, and modify HTML elements and their attributes dynamically with JavaScript.

涵盖的内容

14个视频1个作业

In this concluding module, we will summarize the core JavaScript concepts explored throughout the course. You’ll reflect on how to effectively combine JavaScript with HTML and the DOM to create dynamic, interactive webpages.

涵盖的内容

1个视频1个作业

In this module, we will introduce React.JS and its component-based approach to building user interfaces. You’ll understand how React simplifies development and improves performance with the virtual DOM.

涵盖的内容

3个视频1个作业

In this module, you will explore different ways to style React components. You’ll also learn how to use props to create dynamic, reusable components and template literals to handle dynamic content within JSX.

涵盖的内容

5个视频1个作业

In this module, we will dive into the concept of component hierarchy in React. You’ll learn how to manage component states, render components conditionally, and utilize the useEffect hook to handle lifecycle events and side effects.

涵盖的内容

3个视频1个作业

In this module, you will learn about React Router DOM and how it helps manage routes in React applications. You’ll explore techniques for navigating between pages, handling errors, and optimizing your app’s routing structure.

涵盖的内容

4个视频1个作业

In this module, you will work on building a complete React project, applying everything you've learned. You'll focus on key features like state management, component communication, and dynamic rendering.

涵盖的内容

2个视频1个作业

In this module, you will build a fully functional calculator app using React. You will implement basic arithmetic operations, handle user inputs, and introduce advanced features like decimal calculations and error handling.

涵盖的内容

2个视频1个作业

In this module, you will explore how to build a RESTful API in React. You’ll learn to fetch data dynamically using Axios, handle pagination, and work with advanced API features like authentication and CRUD operations.

涵盖的内容

5个视频1个作业

In this final module, we will recap the major concepts learned throughout the React section. You’ll be ready to apply React to real-world projects and have a solid foundation for exploring more advanced topics in React development.

涵盖的内容

1个视频2个作业

位教师

Packt - Course Instructors
Packt
1,528 门课程 403,471 名学生

提供方

Packt

从 Mobile and Web Development 浏览更多内容

人们为什么选择 Coursera 来帮助自己实现职业发展

Felipe M.

自 2018开始学习的学生
''能够按照自己的速度和节奏学习课程是一次很棒的经历。只要符合自己的时间表和心情,我就可以学习。'

Jennifer J.

自 2020开始学习的学生
''我直接将从课程中学到的概念和技能应用到一个令人兴奋的新工作项目中。'

Larry W.

自 2021开始学习的学生
''如果我的大学不提供我需要的主题课程,Coursera 便是最好的去处之一。'

Chaitanya A.

''学习不仅仅是在工作中做的更好:它远不止于此。Coursera 让我无限制地学习。'
Coursera Plus

通过 Coursera Plus 开启新生涯

无限制访问 10,000+ 世界一流的课程、实践项目和就业就绪证书课程 - 所有这些都包含在您的订阅中

通过在线学位推动您的职业生涯

获取世界一流大学的学位 - 100% 在线

加入超过 3400 家选择 Coursera for Business 的全球公司

提升员工的技能,使其在数字经济中脱颖而出

常见问题