How to Create a Website in just Few Minutes
Last Updated on 16 Aug 2021 by Harsh Vishwakarma
6 mins read
In this guide, we will understand how to create a Webpage in just a few minutes. Before starting let us have a look at the prerequisites.
Prerequisites
- Basics of HTML and CSS
- Yeah, you need only HTML and CSS
To make this guide simple, we will break this is a guide into parts
Start an HTML Project
Create an index.html file and open it in your preferred Code Editor, In this guide, we will use VSCode as our Code Editor. Add the basic Boiler Plate of HTML in your index.html
Now your index.html will look like
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create Website in few Minutes</title>
</head>
<body>
<!-- Your Body Code -->
</body>
</html>
Now Since your Basic Boiler Plate code is ready Let's add the CDN of Tailwind into the head of our index.html file
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">Now you have completed 50% of your work.
What we are doing
We have added a CDN of CSS Framework (Tailwind CSS) to our Project. Now all CSS has been already written in this CSS file which we have embedded in your file.
Now we will go use a very useful tool named Tailblock. Here you can see lots of Code Snippets for various Headers, Footers, Heros, CTAs, etc
Now you have to visit the site of Tailblock.
You can just select any from the listed snippets and click on the View Code.
You can also select from the various listed colors. And now just click on the Copy to Clipboard Button.
Now just paste it into the body of your index.html.
Boom, Now just open your index.html into your browser and see the code snippet you've copied.
And similarly in the same manner you can copy code the other snippets, and paste it in your index.html at desired place.
Now you can change the Content according to your needs and Boom your desired WebPage is ready.
Hope you've liked this Tutorial !!!
Now If you want to Publish your Website on Github Pages, You can have a look at this Guide.
Category: Hacks | Web Development
Relavent Tags: Youtube, Website, Tailwind, Tailblock, Hacks