Apply Front-End Web Development with HTML, CSS & JS

位教师：EDUCBA

包含在中

了解更多

6个模块

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

初级等级

推荐体验

1 周完成

在 10 小时一周

灵活的计划

自行安排学习进度

6个模块

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

初级等级

推荐体验

1 周完成

在 10 小时一周

灵活的计划

自行安排学习进度

您将学到什么

Build structured web pages using HTML5 semantic elements.
Design responsive layouts with CSS, Bootstrap, and animations.
Implement interactive features using JavaScript and jQuery.

要了解的详细信息

可分享的证书

添加到您的领英档案

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

了解关于 Coursera for Business 的更多信息

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

该课程共有6个模块

By the end of this course, learners will be able to build structured web pages, style responsive layouts, implement interactive behavior using JavaScript, and design a professional portfolio website. Learners will apply HTML5 semantic elements, CSS layout and animation techniques, JavaScript core concepts, jQuery-based DOM manipulation, and Bootstrap’s responsive grid system to create modern, user-friendly front-end interfaces.

This course benefits learners by guiding them through a complete front-end development journey—from foundational web concepts to practical, real-world implementation. Learners will gain hands-on experience with user events, drag-and-drop interactions, asynchronous programming with Promises, and responsive design principles that are essential for today’s web applications. By the end of the course, learners will be able to confidently design and structure a portfolio website that demonstrates practical front-end skills. What makes this course unique is its end-to-end, application-focused approach. Instead of isolated topics, concepts are progressively connected and reinforced through practical design scenarios and interface-building workflows. This structured progression helps learners move beyond theory to confidently apply front-end development skills in real-world projects and professional contexts.

This module introduces the fundamentals of front-end web development, covering core web technologies, user interaction through events, geolocation features, and interactive drag-and-drop functionality.

涵盖的内容

6个视频4个作业

6个视频总计57分钟

Introduction to Web Development 13分钟
HTML5 Core Elements Overview 11分钟
HTML and JavaScript Events 9分钟
Geolocation API in HTML5 10分钟
Drag and Drop Fundamentals 6分钟
Advanced Drag and Drop Implementation 8分钟

4个作业总计60分钟

Web Development Essentials 10分钟
Events and User Interaction 10分钟
Drag and Drop in Practice 10分钟
Graded-Foundations of Modern Web Development 30分钟

This module focuses on styling and layout techniques using CSS, including selectors, the box model, semantic structure, responsive design, transitions, and animations.

涵盖的内容

10个视频4个作业

10个视频总计82分钟

CSS Basics and Syntax 8分钟
Advanced CSS Styling 5分钟
HTML5 Main Element Basics 7分钟
Practical Usage of Main Element 7分钟
CSS Box Model Explained 10分钟
CSS Combination Selectors 5分钟
Responsive Design with Media Queries 11分钟
Browser Inspect Element Tool 7分钟
CSS Transitions Explained 12分钟
CSS Animations 9分钟

4个作业总计60分钟

CSS Fundamentals 10分钟
Layout and Structure 10分钟
Responsive and Animated Design 10分钟
Graded-Styling the Web with CSS 30分钟

This module builds a strong foundation in JavaScript by covering data types, debugging, design patterns, user interaction via the console, and asynchronous programming with Promises.

涵盖的内容

8个视频4个作业

8个视频总计74分钟

JavaScript Data Types 10分钟
JavaScript Console Usage 10分钟
Advanced JavaScript Concepts 12分钟
Singleton Pattern Concept 7分钟
Singleton Pattern Implementation 7分钟
User Interaction via Console 13分钟
JavaScript Promises Introduction 7分钟
Handling Promises and Chaining 8分钟

4个作业总计60分钟

JavaScript Fundamentals 10分钟
Design Patterns and Interaction 10分钟
Asynchronous JavaScript 10分钟
Graded-JavaScript Core Concepts 30分钟

This module explores efficient DOM manipulation using jQuery, including selectors, keyboard event handling, and dynamic HTML attribute management.

涵盖的内容

7个视频4个作业

7个视频总计52分钟

Introduction to jQuery 9分钟
jQuery Selectors Basics 6分钟
Advanced jQuery Selectors 8分钟
Keyboard Events Basics 6分钟
Advanced Keyboard Event Handling 7分钟
HTML Attributes and Values 6分钟
Dynamic Attribute Manipulation 10分钟

4个作业总计60分钟

Getting Started with jQuery 10分钟
Advanced Selectors and Events 10分钟
HTML Attributes in Action 10分钟
Graded-DOM Manipulation and jQuery 30分钟

This module introduces the Bootstrap framework, focusing on responsive layout design using containers, grid systems, pagination, and advanced grid configurations.

涵盖的内容

6个视频3个作业

6个视频总计58分钟

Introduction to Bootstrap Framework 13分钟
Bootstrap Fluid Containers 7分钟
Responsive Layout with Fluid Containers 9分钟
Pagination Design and Logic 13分钟
Bootstrap Grid System Basics 6分钟
Advanced Bootstrap Grid Layouts 10分钟

3个作业总计50分钟

Bootstrap Essentials 10分钟
Grid Systems and Pagination 10分钟
Graded-Responsive Layouts with Bootstrap 30分钟

This module applies front-end development skills to build a professional portfolio website, covering structure, styling, navigation, and contact page design.

涵盖的内容

7个视频4个作业

7个视频总计59分钟

Portfolio Page Structure 7分钟
Portfolio Page Styling 9分钟
Portfolio Header Design 7分钟
Enhancing Portfolio Titles 8分钟
Services Section Design 12分钟
Dark Navbar Design 10分钟
Contact Page Design 7分钟

4个作业总计60分钟

Portfolio Structure and Styling 10分钟
Headers and Visual Enhancements 10分钟
Sections, Navigation, and Contact 10分钟
Graded-Building a Professional Portfolio Website 30分钟

位教师

EDUCBA

930 门课程 221,065 名学生

提供方

EDUCBA

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

Felipe M.

自 2018开始学习的学生

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

Jennifer J.

自 2020开始学习的学生

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

Larry W.

自 2021开始学习的学生

''如果我的大学不提供我需要的主题课程，Coursera 便是最好的去处之一。'

Chaitanya A.

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

通过 Coursera Plus 开启新生涯

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

了解更多

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

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

探索学位

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

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

了解更多

常见问题

To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.

When you purchase a Certificate you get access to all course materials, including graded assignments. Upon completing the course, your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.

Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.