How the Front-End works

<h2>What is Front-End ?</h2>
<p>According to <a href="" target="_blank">Wikipedia</a>:
Front-end web development is the practice of converting data to graphical interface for user to view and interact with data through digital interaction using <strong><em>HTML</em></strong>, <strong><em>CSS</em></strong> and <strong><em>JavaScript</em></strong>.</p>
<ul>let is decode these different Terms:
<li><strong><em><ins>HTML</ins></em></strong> : or Hypertext Markup Language is the one who is responsible of the content of the web page or web application some developers tend to call it as the main Skeleton , indeed is composed by many different elements providing  the Document Object Model (DOM) combined together they form web page components.In other terms we can use the metaphor <strong><em>NOUNS</em></strong> in a sentence.</li>
<li><strong><em><ins>CSS</ins></em></strong> : or Cascading Style Sheets which is responsible of the design of the web pages and web applications (the presentation).In other terms we can use the metaphor <strong><em>ADJECTIVES</em></strong> in a sentence
<li><strong><em><ins>JavaScript</ins></em></strong> : It is a Object-oriented language which is also characterized as dynamic, weakly typed, prototype-based and multi-paradigm.It is the one which allows interactive pages as most of browser hold a JavaScript engine to execute it, so it is the language which is responsible of dynamic effects on web pages and web application by using (DOM).In other terms we can use the metaphor <strong><em>VERBS</em></strong> in a sentence</li>
</ul>
<p>Nowadays the web pages and web applications are more and more dynamic and as well styled which gave birth to many different libraries and frameworks for CSS and JavaScript</p>
<h2>Frameworks and Libraries:</h2>
<ul>
<li><h4>Libraries</h4></li>
<p>A library is in a simple words a code that has been developed by other developers on a way that can be used again for repetitive tasks specially. It is a collection of functions, objects, and classes that you can use in your application. And you don't have to worry about its implementation as the library abstracts the different layers for you. 
So you can call the built-in functions of the library and pass it the parameters of your application and it will execute it for you.
and the real magic of libraries that they don't set any restrictions about how you structure it in your application.</p>
<li><h4>Frameworks</h4></li>
<p>The frameworks in opposite they dictate to you the flow of control of your application, it tells you how to structure and organize everything.</p>
</ul>

<h2>Popular Frameworks and Libraries for design CSS:</h2>
<h4>Frameworks:</h4>
<ul>
<li><strong><em><ins>Bootstrap</ins></em></strong> : The most famous and used on the net, it was developed by the designers of Twitter.very complete framework that made building responsive websites very fun to develop by using its grid system and typography.</li>
<li><strong><em><ins>Materialize</ins></em></strong> : A modern responsive front-end framework based on Material Design.</li>
<li><strong><em><ins>Bulma</ins></em></strong> : is an open source CSS framework based on Flexbox and SASS very easy to learn and use.</li>
</ul>
<h4>Libraries:</h4>
<ul>
<li><strong><em><ins>WickedCSS animations</ins></em></strong> : A library of pure CSS animations.</li>
<li><strong><em><ins>Epic Spinners</ins></em></strong> : A collection of CSS-only spinning icons with VueJS integration.</li>
<li><strong><em><ins>Boilerform</ins></em></strong> : An HTML and CSS boilerplate to make forms easy to code and implement.</li>
</ul>
<h2>Popular Frameworks and Libraries for dynamic effects JavaScript:</h2>
<h4>Frameworks:</h4>
<ul>
<li><strong><em><ins>AngularJS</ins></em></strong> : was once the most famous front-end framework among developers and the most popular. </li>
<li><strong><em><ins>Vue.js</ins></em></strong> : is a lightweight JavaScript framework that is becomning very popular nowadays(2018). Vue's HTML-based template syntax binds the rendered DOM to the instance data. </li>
<li><strong><em><ins>Ember.js</ins></em></strong> : is a front-end framework based on the  Model-View-ViewModel (MVVM) pattern.</li>
</ul>
<h4>Libraries:</h4>
<ul>
<li><strong><em><ins>React</ins></em></strong> : is a JavaScript library built by the developers of Facebook and Instagram. Becoming very popular due to its unique concept of reacting with web components. </li>
<li><strong><em><ins>jQuery</ins></em></strong> : it is the one that made JavaScript more easy to use and DOM manipulation very easy task due to CSS selector, event handling which allowed the AJAX calls that raised its fame. </li>
</ul>

<h2>Conclusion</h2>
<p>Front-end development as any other technology is always changing and everyday there are new frameworks and libraries being built and introduced, as developer should be always updated and the concept of always keep learning become more than indispensable especially if you are willing to become a talented and skillful developer.
Having the basics of HTML, CSS and JavaScript and really master them should make it really easy to learn any new framework or library.</p>