Design a Complete Responsive Personal Portfolio Website From Scratch 💼 - HTML, CSS & Javascript

Опубликовано: 05 Декабрь 2024
на канале: Coding Snow
39,551
1k

💼 Design Your Own Responsive Personal Portfolio Website from Scratch | Dark/Light Theme | Easily Customizable Theme Color and Images - Using HTML, CSS & Javascript

➡️ 11:17 - Examples for customizing website theme color and images.
➡️ 7:32:33 - Creating your own avatar image for the project (Using Photoshop)

Subscribe! 🔔 + Like for More! ❤️❄️

∎ Get This Project Source Codes - https://buymeacoffee.com/codingsnow/e...

💙 Become a Member to Get All Source Codes -   / codingsnow  

Support My Work 🖤
--------------------------------------
◾ Buymeacoffee - https://www.buymeacoffee.com/codingsnow
◾ Patreon -   / codingsnow  

========================
📦 Download File Setup (Files + Images + Photoshop PSD Files) - Start From Scratch
https://www.codingsnow.com/2024/12/tu...

✅ Clear Coding ✅ Easy to Follow

📚 Chapters
==============
0:00 - Project Demo - Dark Mode
4:30 - Project Demo - Example for Send/Receive Emails from Contact Form
6:18 - Project Demo - Light Mode
8:39 - Project Demo - Responsiveness for Small Screens
11:17 - Examples for Customizing Theme Color and Contents
12:04 - File Setup
13:39 - Import Google Fonts
14:38 - CSS Variables
21:23 - Header (Html)
25:20 - CSS for Reset/Normailze Elements
26:17 - Base CSS Styles
27:16 - Header (Css)
36:19 - Bottom Navigation Menu (Html, Css)
57:06 - Home (Html, Css)
1:18:32 - About Me (Html, Css)
1:34:44 - My Resume (Html, Css, Javascript)
2:16:58 - Services (Html, Css, Javascript)
2:51:42 - Portfolio (Html, Css)
3:38:50 - Testimonials (Html, Css, Javascript)
3:56:14 - Contact Me (Html, Css, Javascript)
4:24:16 - Send/Receive Emails from Contact Form (Html, Javascript)
4:39:42 - Footer (Html, Css)
4:47:23 - Page Scroll Bar (Html, Css)
4:48:52 - Shrink header height on scroll (Css, Javascript)
4:52:19 - Bottom navigation menu item active on scroll (Html, Css, Javascript)
4:57:23 - Bottom navigation menu behavior - on page load, page scroll, click menu show/hide buttons (Html, Css, Javascript)
5:11:47 - To Top Button with Scroll Indicator Bar (Html, Css, Javascript)
5:21:43 - Customized Cursor (Html, Css, Javascript)
5:35:12 - Website Dark/Light Theme (Html, Css, Javascript)
5:58:25 - Media Query Breakpoints (Css)
7:07:23 - Scroll Reveal Animations for Elements (Html, Javascript)
7:22:50 - Customizing website theme color & images (Html, Css)
7:32:33 - Examples for creating avatar images for the project (using Photoshop)

🔗External Sources
------------------------------------
◾ Image Source - https://www.pexels.com
◾ Remix icon - https://remixicon.com
◾ SwiperJS - https://swiperjs.com
◾ EmailJS - https://www.emailjs.com
◾ ScrollReveal JS - https://scrollrevealjs.org

Hire Me 🔖
-----------------------
◾ Hire me to customize this project for your purpose - https://www.buymeacoffee.com/codingsn...
◾ Hire me to Fix your project Bugs & Issues - https://www.buymeacoffee.com/codingsn...
◾ Hire me to Convert your Figma, PSD, and XD Design to an HTML Website - https://www.buymeacoffee.com/codingsn...

#CodingSnow #WebDesign #protfolio
----------------------------------------------
Copyright Disclaimer under section 107 of the Copyright Act of 1976, allowance is made for “fair use” for purposes such as criticism, comment, news reporting, teaching, scholarship, education, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing.


Смотрите видео Design a Complete Responsive Personal Portfolio Website From Scratch 💼 - HTML, CSS & Javascript онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Coding Snow 05 Декабрь 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 39,551 раз и оно понравилось 1 тысяч людям.