Digitization, the digital revolution of our time, offers incredible opportunities. Ten years ago, very few people could have predicted the new opportunities the Internet will offer today. I want to invite you on a journey to the webspace that few people know, even today. I want to invite you to change that.
At the end of this journey, which only takes a few minutes, you will have your presence, a website on the Internet. You don’t need any software to be installed on your computer. You won’t pay anything for this trip. Your new website on the Internet will also be free.
Unbelievable? Start your journey!
Services are not an invention of our time. Services have been offered and used by people for thousands of years. You can bake your bread or do repairs on the house yourselves. Unfortunately, the results is not that sure in terms of quality: it depends. Excellent services delivered by professionals provides best results. But you have to pay for that. For good reasons. People delivering services need an income to give their families a roof over their heads and feed them. A good bakery offers one bread to try, but not five. The offerings in the digital world are not different here.
Two service providers are required for the trip: Github and Netlify. The platforms provided by Github and Netlify are used to build and control the J1 website on the Internet. Both providers give full access to their services with no limits. Free services with no restrictions are not the case with all digital service providers. Therefore, I can recommend these two service providers for entry into the world of modern digital services.
If you do not already have accounts, sign up to be prepared for the journey:
|It is recommended to sign up for Github first. You can use the account data from Github to register on Netlify.|
The people on Netlify prepared a really easy process to bring a website live using a template like J1 on the Internet in minutes. This is magic but real.
|The 1-Click Deployment on Netlify opens a new window, a new tab in your browser. From the section Deployment Reference you find all the steps for this process in all details. To control the deployment process better, place the browser’s windows side-by-side.|
Start the magic on Netlify!
For your reference, find all steps required for the 1-Click Deployment on Netlify. All steps are commented on to understand better what will happen.
To get access to Github using your account on Netlify, you need to sign in first.
When you’ve successfully authenticated on Github, a secure connection gets established between Netlify and Github. This connection enables the provisioning process to copy (clone) the template in your repo space at Github. The cloned repository is used for all of the next steps in building your website.
In the configuration step, you can change the default name j1-template-starter of the repository on Github. Customize the name for your needs. This repo (at Github) is used for all the following steps to automatically create your new website.
You can manage the build and deployment processes from your account’s Team overview page on Netlify. You can manage the build and deployment processes from this page. From the Builds page, you can check the build process for more details.
After the build process has finished, you have a new website with a random name generated on Netlify. It is recommended to change that name for your needs.
The customized name is the base for the URL to access your website on the Internet.
After changing the name of web, have a look and visit your new web.
Your repo on Github
Look at your Github account after the build and deployment processes are finished on Netlify. Check for the repository of your new website created for you.
From the repository detail view, you can manage all settings of your new web online from Github. For little changes, this is possible but not convenient. Check the section What next for a much better way to manage your site’s content.
A website based on the J1 Template is set to development mode by default. If you check the SEO numbers calculated by Lighthouse, you’ll find good numbers for performance, but they are not excellent. The development mode for the J1 Template supports developers in changing content and checking the outcome but does not generate optimized code for production.
The mode production for the J1 Template is the base for generating optimized code for production and deploying a site high-performance. Optimized code is fully compressed for all HTML pages, JS and CSS files. Additionally, all info and debug messages (displayed in a browser’s console) are removed, and only warning and error messages are issued. Removing not-needed parts results in excellent performance and secured content.
You got it managed. The new website is online. The site was built from the boilerplate of J1 Template. For sure, not your site but a good starting point for your content to make your ideas of a website real. And you’re prepared well. The control center on Netlify is in place, and your site is sitting a repo at Github. Not that bad. The next step is to create a local copy of the repo from Github to a folder on your PC to start developing from a local system.
Developing a website should be done from a local PC. J1 comes with a full-featured development system. The local copy of the repo contains already all components required to manage the development process, including a webserver. And better: your control center on Netlify supports you for the redeployment of the modifications you made. And again, all steps needed to deploy your site is done in minutes. No big deal to bring your real website online.
All you need to know is available with the tutorial J1 in a Day. You learn how to create websites based on the J1 Template. This tutorial focuses on the basics of using Jekyll, managing J1 based sites, and deploying the modifications of your site.
Start the next journey, go for J1 in a Day.