Frameworks
Before we can start working with a framework, it is important to know what frameworks actually are, which frameworks exist and what the pros & cons are of these frameworks.
Jump to:
To explain what a framework is, Scott Morris in this article wrote a good metaphor to explain what frameworks do in JavaScript. He wrote that coding in frameworks can be compared to building a house:
When you start building a house, you can do this in two ways. In the first way you can make the building material yourself by, for example, cutting down a tree and sawing it so that you have planks of wood. But this would not be efficient with such a large project as building a house. The second way is to go to the store and just buy all the pre-made materials (like the wood, stones, etc.). This is exactly the idea of frameworks in JavaScript.
Frameworks are:
Collections of JavaScript code libraries that provide front-end developers with pre-written JavaScript code to use for routine programming features.
So frameworks are pieces of structured code libraries that ensure that developers can start new projects faster and more easily and maintain existing projects more easily. But this does not mean that using a framework is necessary for every project. Frameworks are generally more useful for larger projects such as websites with hundreds of subpages.
Despite the fact that this concept is fairly clear, in practice it appears to be more difficult to say exactly what a framework is. This mainly has to do with libraries that have framework functionalities and vice versa. Because of this there are also many discussions going on whether a framework is more of a library or not.
In JavaScript there are many different frameworks (or libraries that function as frameworks) to build your project with. This is partly because you could also write a framework yourself. Yet there are some that are the best known and also the most used. The most famous are React, Angular and Vue Source. As an assignment for De Volkskrant, a choice could mainly be made from the frameworks React, Vue or Svelte. I will briefly tell you something about this per framework and list the pros and cons based on some resources: Source, Source, Source:
React was developed by a small group that works fulltime at Facebook. Today there are also many contributors around the world. They describe React as a library for building user interfaces (Source, Source, Source logo). So actually React is a library and not a framework.
- Easy to learn and use.
- Large community, so useful for fixing errors.
- Structure of React's documentation does not make sense.
- Uses JSX, so no real structure in HTML and JavaScript.
Vue was created by the ex-Google employee Evan You in 2014. On the website, Vue is described as: a progressive framework for building user interfaces (Source, Source, Source logo). So Vue is a framework.
- Great documentation.
- Uses HTML templates, so it's more easy to understand for less experienced programmers.
- Less flexible than React or Svelte.
- Fewer resources (compared to React).
Svelte was created by Rich Harris, graphics editor at the New York Times, in 2016. Svelte is described as a compiler rather than a framework (Source, Source, Source logo).
- Svelte contains a great documentation based on examples (therefore very practical).
- Runs at built-time, so no virtual DOM needed.
- Svelte files are smaller than other frameworks.
- Small community, so difficult for fixing errors.
- Confusion in the syntax and variable names.
Personally, I think it is important that a framework has a good community for fixing errors. This is mainly because I have never worked with a framework before. In addition, I am someone who can structure code well and I found it less important that for example, JSX could be less structured. I also think it is important that a framework is still somewhat flexible, especially in this case when we have to work with the library D3 within a framework to be able to create graphs.
So, based on the pros and cons of the different frameworks that I have mentioned and on my own personal preferences, I decided to start working with React.