Becoming A Frontend Engineer - Actions
This is the fourth and final article in the series “Becoming a frontend engineer”. In the first article, I introduced what frontend engineering is all about, and explained the three aspects of frontend engineering. The second article explained how to add text to a webpage. The third article showed how to add styling to a webpage. In this article, we will discuss actions on a webpage and how they are created and handled.
What are actions?
Actions are those specific tasks that cause you to engage actively with a web page. For example, when you visit the Google homepage, you see a search bar. When you type in what you are looking for and press the enter or return key, it means you have performed an action. This is also similar to filling in a form and clicking on the submit button. All actions are written into a web application using a programming language called Javascript (JS for short).
Javascript is a scripting language which means it is interpreted and changed into machine code when the code is run. In learning to write Javascript, you would learn the different data types, variables, functions, methods, arrays, and other concepts that make interacting with a web page possible.
How to create a Javascript file
To create a Javascript file, the filename should have an extension of .js. For example,
script.js or data.js
Building web applications can quickly become tedious and cumbersome as they become larger. Javascript has frameworks and libraries which help us break down our application into smaller bits, send requests to the server side, manage data across the entire applications, etc. They exist to make our work easier and faster. There are many libraries for Javascript on the frontend, but I would introduce you to the three major ones as of this moment: React, Vue & Angular.
React
React is a free and open-source front-end JavaScript library for building user interfaces based on components. It is helpful in building complex and reusable user interface(UI) components of mobile and web applications as it follows the component-based approach. It is maintained by Meta and a community of individual developers and companies. Creating React applications usually requires the use of additional libraries for routing, as well as certain client-side functionality. To learn more about React, visit the official documentation here.
Vue
Vue.js is a progressive framework of JavaScript used to create Dynamic User Interfaces and single-page applications. It is called a progressive framework because it is being changed and developed continually. Vue.js framework can be integrated with the existing applications very easily. It has a lot of components for everything. You can integrate it with any application that is written in JavaScript. It was built by Evan You, and has an ecosystem that maintains it. To learn more about Vue, visit the official documentation here.
Angular
Angular is one of the most popular frameworks for UI design today, with hundreds of thousands of developers worldwide contributing to its community project. Its compelling features and performance have made it an essential tool for any web developer to have in their toolbox. It is maintained by Google, and its primary function is to design single-page applications. Angular has significant advantages as a framework, while also providing a common architecture for developers to work with. It allows developers to create large, maintainable applications. To learn more about Angular, visit the official documentation here.
Conclusion
Javascript is being used by 98% of applications available on the world wide web. It is important to learn the basics of Javascript before going ahead to learn to use libraries because they were built on the concepts of Javascript, and they lay the building blocks of the knowledge required to use these libraries. There are many resources for learning Javascript, but I would recommend Traversy Media on YouTube, W3schools, and You Don’t Know JS.
We have come to the end of the series on becoming a frontend engineer, I hope you enjoyed reading every bit of it and go on to become a world-class frontend engineer! Cheers.
Top comments (0)