Build your Personal Portfolio Website

Download and install VS Code using your web browser, then open the installer to start building your personal website.

Create a project folder for your website using the command prompt by running mkdir to make a directory named my website.

Open the website folder in VS Code and create the core files: index.html, stylecss, and crypt.js to establish the basic site structure.

Create and test the home section of your personal website by copying code for index.html, style.css, and script.js, using ChatGPT and VS Code, and launching live server to view results.

Generate about us section with ChatGPT, insert the code into index.html after the home section, paste style.css at the bottom, and test go live to show the about me section.

Add the project section to your website by copying the project code from ChatGPT, inserting it after the about section, and updating style.css, then test with Live Server.

Fetch the contact us section code from ChatGPT and insert it into index.html, then apply styling from style.css. Test with Go Live to verify a clean, functional contact section.

Add your email and WhatsApp number to the contact section by updating index.html and styles.css, then preview the live site to see the new contact details appear.

Apply smart scroll functionality by using chatgpt to generate and place script.js and style.css into index.html before the closing body tag, then test with live server for advanced scrolling system.

Add a profile picture to the website by placing the image in the project folder, updating index.html and style.css, using ChatGPT for the about section, and testing before going live.

Improve mobile responsiveness by updating the site with the style.css file and integrating index.html into the head, then test with a live server.

Publish your website by creating a public GitHub repository, pushing your project from VS Code via terminal commands, and configuring GitHub Pages to serve the main root as live.

customize your personal website by editing the home, about, project, and contact sections, including name, intro, profile picture, project details, and contact options such as email, WhatsApp, and LinkedIn.

Customize your home section by editing the name and short intro in VS Code, previewing changes with go live to showcase your personal website.

Customize the about section by updating the profile picture and introduction text in your HTML project, using VS Code, updating index.html, and previewing changes with go live.

Customize your project section of your personal website by adding demo videos, generating project section code with ChatGPT, updating files in VS Code, and going live to preview changes.

Customize the contact section by adding your email, WhatsApp, and LinkedIn, preview the page, and go live to update your contact information.

Apply updates to your GitHub repository by using git commands, writing commit messages, and pushing to GitHub to keep your personal website in sync and updated.

Upgrade your portfolio site with Google AI Studio by updating index.html, style.css, and script.js, then preview and test with live server to refine a more professional profile.

Use ChatGPT to generate prompts and Google AI Studio to produce and paste script.js, style.css, and index.html into your portfolio site, then preview with Go Live for a professional look.