Let's develop real-world web application components to get a strong grip on the basic pillars of front-end web development.

Zero to Hero in Front-end Web Development

This module is designed to take your basic knowledge of HTML, CSS, and JavaScript and apply it to build more advanced, practical, and real-world web components. We will go through the process of developing several complex components, including examples such as eBay's dropdown menu, Twitter's infinitely scrolling list, and Medium's tooltips. These are real-world examples that you will be able to relate to, and will give you an understanding of how these types of components can be implemented in a professional setting.

Throughout this module, we will focus on the best practices and challenges of creating these types of components on the front-end.

Projects

Congratulations! You have successfully completed the “Projects” module.

## Summary

In this module, we learned how to build an HTML responsive website. We started by building a drop-down menu and used different styling techniques to make our sub-menu catchy. Then we learned to build the basic layout of a tooltip in HTML. Moving ahead, we learned to address the bugs in our implementation of the tooltip. In the latter half, we learned to develop an infinitely scrolling list and its benefits, and their real-world applications.


## What’s next?

Now that we have a working knowledge of creating responsive HTML websites, let’s cover how to launch a website which is necessary for web development in the next module, “Launching a Website.”


Congratulations! You have successfully completed the “Projects” module.

# Summary

In this module, we learned how to build an HTML responsive website. We started by building a drop-down menu and used different styling techniques to make our sub-menu catchy. Then we learned to build the basic layout of a tooltip in HTML. Moving ahead, we learned to address the bugs in our implementation of the tooltip. In the latter half, we learned to develop an infinitely scrolling list and its benefits, and their real-world applications.


# What’s next?

Now that we have a working knowledge of creating responsive HTML websites, let’s cover how to launch a website which is necessary for web development in the next module, “Launching a Website.”


Here's a quick summary of what we learned from the "Projects" module.

Building a Dropdown Menu

Building Tooltips

Building an Infinite List

Conclusion

Final Remarks

Summary