Sully's Next Project
Having completed our JasmineWS tutorials, plus reading both of Fiddle & Fettle's guides to Building a Website and Building a Webpage. Sully feels confident that he has grasped enough basic knowledge of
- Code Editors
- HTML
- CSS
- GitHub
- Hosting
To enable him, to have a try at designing & building a new website on his own.
To help him along we've written him a brief guide split into three stages Plan, Build and Launch, hopefully it will help you too.
Plan
Start by thinking. What is the website going to be about, it's purpose, and the type of content you want to display on it. Plus who are you hoping will use it?
Once you have worked out the subject / content / user base for your website, it's best to draw out your design ideas whether that be digitally or simply pen on paper.
Firstly draw a rough outline of how you want the site to look, just like sully is doing.
Next plan out each section in more detail, with contents such as titles, subject notes, image placement, and when you are satisfied with your plan go ahead and start building.
To help you plan what layout's are possible to create using JasmineWS templates, checkout our JWS Styles Layout page.
Build
Using the JasmineWS templates as a base to build from, you can make your own basic website. With the help of our docs Styling pages to show you the scope of what can be used, added to or amended from the template files.
Though if you are wanting to expand your HTML or CSS knowledge further, you'll find some useful resources linked on our Extras page.
To start building, just like we did in our tutorial. Open your GitHub account and click the green Use this template button, then Create a new repository option and set up the new repository for your new website.
Then go ahead and open VSCode by clicking the . key and start to build your design.
Launching & Beyond...
Deploy, Domain's & Hosting
Once you're happy with your build it's time to deploy it to hosting and configure your domain name.
We've put together a Website checklist to help recap and expand on some of the areas of deploying a site from our tutorial.
Beyond
So now you have launched your website it can be great to learn how it compares to other sites and standards.
Lighthouse by Google is a great way of doing this, which you can now read about in our Lighthouse Sprout of Wisdom.
