DEV Community

Francesca Ansell
Francesca Ansell

Posted on

Comparing Boilerplates

In this blog post I will be comparing a React, Stencil, Vue, and Angular boiler-plates. A boilerplate is a reusable template to start your projects with.
The stencil boiler plate included a readme file that explains the properties and their attributes which was extremely helpful in understanding the code. I was able to quickly install the dependencies and run the program without any issues. I do not recognize some of the folder conventions such as dist, and www. It is easily understood this boilerplate creates a web component. Overall the boiler plates has lots of folders and files that I am unsure how to utilize.

The Vue Boilerplate uses folder structure and naming conventions I immediately realize. The Vue boilerplate was much easier to digest and understand. This boilerplate was also very easy to start up.

The angular boilerplate reminded me of a react project with a views, images, and styles folder. I had a lot of trouble getting this project to run due to 'gulp' which I have never used before.

I added the react boilerplate. This boilerplate had a large amount of miscellaneous files that I have never seen before and do not know how to utilize. It also had a large amount of folders and nested folders. I was able to install the dependencies and run the program without any trouble. This boilerplate includes lots of comments to help you navigate.

I believe the best developer experience, and boiler plate I would choose to create an application with would be the VUEjs boilerplate. It was very easy to understand and navigate which allows the developer to focus on other things such as improved functionality.

Group repo: https://github.com/3B4B/boilerplates
React Boilerplate: https://github.com/react-boilerplate/react-boilerplate

Top comments (1)

Collapse
 
hakimio profile image
Tomas Rimkus

Nobody uses ancient AngularJS (aka Angular v1) anymore. You might want to learn modern Angular (v2+). To start with Angular project, you just use Angular CLI:

ng new my-app
Enter fullscreen mode Exit fullscreen mode