Frontend developement

One of the difficulties with staying up to date with modern web development is the reliance on open-source software that adds features to HTML, CSS and javascript and the many steps involved in the build process. On top of this there are competing programs that solve the same problems and various branches for each of these projects. Sometimes projects merge. Some become market leaders and then the authors have less time and the project gets deprecated. This happens every few years.

For example

Sass: This was created to add features that weren’t available in CSS. It was originally written in Ruby, but then a new branch written in C called LibSass was much faster. For node development a package called node-sass was a wrapper to LibSass and was also fast. But while Sass was having new features added, LibSass had stopped being updated. Now all 3 have been deprecated and replaced with Dart-sass. Meanwhile, this also has a node package (now called sass instead of node-sass) but it’s not as fast as the LibSass version.

If that’s a lot to get your head around between 2019-2022, there are also alternatives to Sass like Less and compass.

These were known as CSS processors. But let’s not stop there. On top of this there are post-processors like auto-prefixer. except this isn’t a standalone project anymore but a plug-in for the PostCSS project.

But styling is also applied to web applications by writing in javascript and this gets converted to CSS, projects such as styled-components for React or JS-in-CSS

OK. This is just the complexity of adding features to provide styling

Next there are linters, CSS linters, javascript linters, linters for formatting and linters to check for errors.   Some linters did both and then split in to separate projects

Then to automate web builds there was Grunt that used XML, Gulp using javascript, WebPack and Parcel are more modern options. There are package managers like browserify that often gets paired with Gulp. Even npm has scripts that can be used as task runners.

npm was the default package manager for Node. There was a time when it didn’t have the features that the developers at Facebook needed so they wrote their own version called Yarn. A few months later npm added the features Yarn had and now the 2 just compete with each other. Choose one, choose both. Thankfully these are the 2 main projects.

Of course, node is continuously being updated so maybe you have several different projects that use different node versions. Now you need node version manager, NVM, to allow you to easily swap between versions. 


Posted

in

by

Tags: