Website - Go live

Früher war der Go live im Prinzip immer gleich. Website Files per FTP oder SSH auf den Serverspielen und Datenbank per SSH, phpMyAdmin oder anderen Tools hochspielen.

Durch neue Arbeitsweisen und Tools wie Webpack, Docker etc. hat sich auch das Deployment verändert.

Webpack build

Wenn mit einem Bundler wie Webpack gearbeitet wird, muss man den Bundler anweisen zunächst eine Distribution zu erstellen. Dabei kann der Bundler einige Aufgaben übernehmen: TypeScript in JavaScript umwandeln, Sass/Less Dateien kompilieren und vieles mehr.

Terminal:

npm run build

This command will run the script located in the /package.json file in the scripts > build property.

Wait a few seconds and the files should be available in the /dist/ folder which will be created when build is executed. You can then put those files online using your favorite FTP client.

Whenever you want to upload a new version, run npm run build again even if the /dist/ folder already exists.

Vercel

Vercel

Vercel is one of those "modern" hosting solutions and features continuous integration (automatisation of testing, deployment and others development steps like this). It is very developer friendly and easy to setup.

You can use it for complex projects, but also for very simple "single page" websites like the ones we create within this course.

Before continuing, be aware that there is no partnership between me (Bruno Simon) and Vercel. I just like to use it for my small creative experiences.

Also, there are other good alternatives that we should mention like Netlify and GitHub Pages.

Be aware also that you might see slight differences between the rest of this lesson and your own experience with Vercel. It's quite a new solution and the developers keep improving the service.