In this video I will show you complete step by step process of developing a web developer portfolio website with HTML, Tailwind CSS. After building the website we will deploy it using Firebase hosting services and we will give custom domain to our firebase website.
Chapters:
0:00 Project introduction
2:10 Project setup
3:34 Installing Tailwind CSS with NPM
10:09 Outlining structure of website with HTML
12:03 Styling Navigation bar
15:44 Creating hero section
21:24 Creating skills section
25:06 How to apply same style to different elements in Tailwind CSS
30:00 Creating YouTube section
34:35 creating services section
37:09 Setting background image with parallax effect
41:09 How to use icons from font awesome?
46:06 Creating project section
51:36 Creating Contact section
1:07:48 Adding animation to all sections
1:18:21 Making the webpage mobile friendly ( Responsive )
1:28:26 How to host website with firebase
1:32:56 Adding custom domain to firebase hosted website
Lets connect:
Linked In:
https://www.linkedin.com/in/prem-sagar-b45a4580/
Join my facebook page:
https://www.facebook.com/groups/325415101888709
Instagram:
https://www.instagram.com/entrepreneurprem/
Twitter:
https://twitter.com/PremSagar24
Hashtags:
#websitecreate, #portfoliowebsite, #webdevelopment
Chapters:
0:00 Project introduction
2:10 Project setup
3:34 Installing Tailwind CSS with NPM
10:09 Outlining structure of website with HTML
12:03 Styling Navigation bar
15:44 Creating hero section
21:24 Creating skills section
25:06 How to apply same style to different elements in Tailwind CSS
30:00 Creating YouTube section
34:35 creating services section
37:09 Setting background image with parallax effect
41:09 How to use icons from font awesome?
46:06 Creating project section
51:36 Creating Contact section
1:07:48 Adding animation to all sections
1:18:21 Making the webpage mobile friendly ( Responsive )
1:28:26 How to host website with firebase
1:32:56 Adding custom domain to firebase hosted website
Lets connect:
Linked In:
https://www.linkedin.com/in/prem-sagar-b45a4580/
Join my facebook page:
https://www.facebook.com/groups/325415101888709
Instagram:
https://www.instagram.com/entrepreneurprem/
Twitter:
https://twitter.com/PremSagar24
Hashtags:
#websitecreate, #portfoliowebsite, #webdevelopment
- Category
- Web design
Be the first to comment