a_web VS ingo-steinke.de

As mentioned earlier, we will be continuing from a previous blog repo about Webpack basics (optimized branch), so we keep this blog shorter and only include the important details. We had already set up webpack to work well with loaders like post-css and babel. We will only add @babel/preset-react as a dev dependency, update the babel.config.js presets to include this, update webpack.config.js to resolve both .js and .jsx files extension and of course do some cleanup, including deleting files that were specific to that blog, as well as updating the entry and output values (webpack.config.js) to match what we have in the *.libraries.yml.

Our blog is about improvement, so it's better if we start with something to improve upon.I went ahead and made an app and hosted it on heroku, also pushed its code to github (branch name: unoptimized). The final code is also available on github (branch name: optimized).

My current checklist starts with "improve test coverage". You can see the rest on GitHub (refactor CSS after snapshot testing).

I had made a pull request called Liquid flatfishy floundry vector animation with a meaningless commit history ("prepare liquid animation, remove backgrounds", "try liquid vector animations", "integrate liquid vector animation").

You can verify, copy and paste the relevant code snippets below. I have left out some of my project's details to focus on the test setup. You can find my original source code on GitHub.

A static site generator fitted my needs, and I liked the effortless deployment on Netlify, once I pushed code to GitHub.