DEV Community

Bright Abel
Bright Abel

Posted on

Frontend Technologies

  In the dynamic landscape of web development, frontend technologies are the driving force behind crafting engaging, responsive, and intuitive online experiences. Web development serves as the backbone for user interactions and user experience. These frontend technologies also govern every visual and interactive element that appears in web browsers, from the way they are aligned to the way they are presented to the user, the more users friendly a web is presented the more the user will have a nice experience with the particular web. There are several specified types of web development but I will only be discussing on both Static and Dynamic web development.
  Static web development entails crafting web pages with static content that remains unchanged for all users, displaying the same information every time. Since these pages are pre-built and don't dynamically update, they require manual modifications by the developer to change their content. The advantages of static websites include their simplicity, speed, and cost-effectiveness, making them a more efficient option for development and hosting compared to dynamic websites. They are mostly built with HTML, CSS and sometimes JavaScript, example of this website is a personal portfolio.
  Dynamic web development involves designing and building websites that can modify their content in real-time, responding to user input, preferences, and other variables. By harnessing the power of server-side technologies, these websites can deliver highly personalized, interactive, and engaging experiences for users, creating a dynamic and responsive online environment. For a dynamic web to come into live there are several technologies require; Server-side Languages (PHP, Python, Node.js, e.t.c), Databases (MySQL, MongoDB, e.t.c), Client-side scripting (Javascript, AJAX), and Frameworks (ReactJS, NextJS, e.t.c).
  In this article powered by HNG Internship (

), I will be comparing two different frontend technologies. Contrast the difference between each of them and what makes them better. I will point in this will be focused on both React and Angular.

Enter fullscreen mode Exit fullscreen mode




Comparison between React and Angular

  React and Angular have distinct differences that make direct comparisons challenging. Angular is a comprehensive JavaScript framework built on TypeScript, whereas React is a JavaScript library built on JSX. While React can be transformed into a full-fledged framework by incorporating additional libraries, the resulting workflow and technology stack differ significantly from Angular's. This distinction makes it difficult to draw direct parallels between the two. The table below show the significant comparison between React and Angular.
Enter fullscreen mode Exit fullscreen mode

React vs Angular table

React vs Angular

Structure
React:
React is a library focused on building UI components. It handles the view layer only and leaves the rest to the developerโ€™s choice. While it also offers a high degree of flexibility, allowing developers to choose their own tools for state management, routing, and other functionalities.
Angular:
Angular is a full-fledged framework that provides a complete solution out-of-the-box, including routing, state management, form handling, and more. And it also provides a more structured and opinionated approach, which can streamline development but offers less flexibility compared to React.
Architecture
React:
React uses a virtual DOM to efficiently update the UI by only re-rendering components that have changed, and everything in React is a component, and components can manage their own state and lifecycle.
Angular:
Angular directly interacts with the real DOM, but uses change detection and zone.js to manage updates efficiently, and it also uses component-based architecture but includes more integrated features like services and dependency injection.
Acquisition Challenge
React:
React is easier to start with between the two, especially for developers familiar with JavaScript. The core library is small and straightforward. Choosing and integrating additional libraries for state management, routing, etc., can increase complexity.
Angular:
Angular is more complex to learn due to its comprehensive nature and reliance on TypeScript. Angular comes with a full set of integrated tools, which can speed up development but require learning these tools.
As I close this article, I want to express my gratitude to the HNG internship program for providing me with this exciting opportunity. I am eager to begin my journey and connect with my colleagues, who will undoubtedly become a valuable support system. Through this experience, I am enthusiastic about refining my frontend skills and expanding my knowledge base, and taking my abilities to the next level.

 If you're interested in taking advantage of this opportunity, please click the link at 

to get started.

Enter fullscreen mode Exit fullscreen mode

Top comments (0)