CUSTOM STATIC SITE GENERATOR (Live Coding) [Part 1] | JavaScript | NodeJS | Images

JavaScript Joel - Jul 15 '20 - - Dev Community

Watch as I live code a custom static site generator using JavaScript/Node.js.

In this video, I take an images directory, optimize the images, create thumbnails and also create a webp version of the image.

Part 2: https://www.youtube.com/watch?v=UCWxte7IqME

03:30 Setup ESLint + Prettier
08:50 Setup the Debugger
10:15 Output first resized image
22:15 Output images as webp
22:55 Finally set the correct Glob path
26:30 Finally fix ESLint
30:25 Refactor
39:35 Generate Thumbnails
42:15 Final Code

To follow along:

git checkout https://github.com/joelnet/mojo-gallery.git
cd mojo-gallery
git checkout youtube-video-part-1
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .