https://github.com/n4vrl0s3/Personal-Portofolio-Website
Simple Portofolio
https://github.com/n4vrl0s3/Personal-Portofolio-Website
css3 html-css-javascript html5 javascript portofolio-website simple
Last synced: 5 months ago
JSON representation
Simple Portofolio
- Host: GitHub
- URL: https://github.com/n4vrl0s3/Personal-Portofolio-Website
- Owner: n4vrl0s3
- License: apache-2.0
- Created: 2024-10-31T20:05:27.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2025-01-25T19:15:42.000Z (10 months ago)
- Last Synced: 2025-07-03T22:05:02.070Z (5 months ago)
- Topics: css3, html-css-javascript, html5, javascript, portofolio-website, simple
- Language: CSS
- Homepage: https://personal-portofolio-website.guanshiyinnn.com/
- Size: 4.05 MB
- Stars: 8
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# Personal Portfolio Website
This repository showcases personal portfolio website, a digital platform designed to highlight my skills, projects, and experiences. It serves as a comprehensive overview of my professional journey and creative work.
## Purpose of This Repository
This repository houses personal portfolio website, a digital showcase of my skills, projects, and experiences. It serves as a centralized platform for:
- **Self-Promotion:** Highlighting abilities and achievements.
- **Project Showcase:** Displaying a curated collection of work.
- **Professional Networking:** Connecting with potential employers and collaborators.
- **Personal Branding:** Establishing a strong online identity.
## Demonstration
Here are code demonstrations of functions and components used in the portfolio website:
### HTML
```html
```
### CSS
```css
/* Example CSS for the project card */
.project-card {
border: 1px solid #ccc;
padding: 16px;
margin: 16px;
border-radius: 8px;
transition: box-shadow 0.3s ease;
}
.project-card:hover {
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
```
### JavaScript
```javascript
// Example function to display project details
function displayProjectDetails(projectId) {
const project = projects.find((p) => p.id === projectId);
if (project) {
document.getElementById("project-title").innerText = project.title;
document.getElementById("project-description").innerText =
project.description;
document.getElementById("project-link").href = project.link;
}
}
```
## Features
- Responsive design for optimal viewing on all devices.
- Interactive project gallery with detailed descriptions.
- Contact form for easy communication.
- Blog section to share insights and updates.
## Technologies Used
- **Frontend:** HTML, CSS, JavaScript
- **Deployment:** Vercel
## Project Setup
1. **Clone this repository**
```bash
git clone https://github.com/guanshiyin28/Personal-Portofolio-Website.git
```
2. **Navigate to the project directory**
```bash
cd Personal-Portofolio-Website
```
## Steps to Run
1. **Open the `index.html` file in your browser.**
## License
This project is licensed under the Apache-2.0 License. See the [LICENSE](LICENSE) file for details.
