Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/stephenombuya/graphic-designer-portfolio
A modern, responsive portfolio website for freelance graphic designers, built with React, Tailwind CSS, and shadcn/ui components. This portfolio showcases featured projects, client testimonials, and provides a contact form for potential clients.
https://github.com/stephenombuya/graphic-designer-portfolio
reactjs shadcn-ui tailwind-css typescript
Last synced: 9 days ago
JSON representation
A modern, responsive portfolio website for freelance graphic designers, built with React, Tailwind CSS, and shadcn/ui components. This portfolio showcases featured projects, client testimonials, and provides a contact form for potential clients.
- Host: GitHub
- URL: https://github.com/stephenombuya/graphic-designer-portfolio
- Owner: stephenombuya
- License: mit
- Created: 2024-12-14T09:49:01.000Z (13 days ago)
- Default Branch: main
- Last Pushed: 2024-12-14T09:52:26.000Z (13 days ago)
- Last Synced: 2024-12-14T10:26:13.525Z (13 days ago)
- Topics: reactjs, shadcn-ui, tailwind-css, typescript
- Language: TypeScript
- Homepage:
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🎨 Graphic Designer Portfolio Website
## Overview
A modern, responsive portfolio website for freelance graphic designers, built with React, Tailwind CSS, and shadcn/ui components. This portfolio showcases featured projects, client testimonials, and provides a contact form for potential clients.
## 🚀 Features
### Key Sections
- **Responsive Navigation**: Mobile and desktop-friendly menu
- **Hero Section**: Engaging introduction with call-to-action
- **Portfolio Showcase**: Grid display of featured design projects
- **Client Testimonials**: Social proof with rating system
- **Contact Form**: Direct communication channel for potential clients
### Technical Highlights
- Single-page React application
- Fully responsive design
- Mobile-first approach
- Smooth scrolling navigation
- Interactive UI components
## 📦 Prerequisites
Before you begin, ensure you have the following installed:
- Node.js (v18.0.0 or later)
- npm (v9.0.0 or later)
- Git
## 🛠 Installation
1. Clone the repository
```bash
git clone https://github.com/stephenombuya/graphic-designer-portfolio/tree/main
cd graphic-designer-portfolio
```
2. Install dependencies
```bash
npm install
```
3. Install shadcn/ui components
```bash
npx shadcn-ui@latest init
```
4. Add required shadcn components
```bash
npx shadcn-ui@latest add card button input textarea
```
5. Start the development server
```bash
npm run start
```
## 🖌 Customization
### Updating Content
- Modify `featuredProjects` array to showcase your own design work
- Update `testimonials` with real client feedback
- Replace placeholder text and images with your personal branding
### Styling
- Customize color scheme in `tailwind.config.js`
- Adjust responsive breakpoints as needed
## 📝 TODO
- [ ] Implement backend form submission
- [ ] Add actual project images
- [ ] Set up real social media links
- [ ] Add SEO metadata
- [ ] Implement form validation
- [ ] Add accessibility improvements
## 🔧 Built With
- [React](https://reactjs.org/)
- [Tailwind CSS](https://tailwindcss.com/)
- [shadcn/ui](https://ui.shadcn.com/)
- [Lucide React](https://lucide.dev/guide/packages/lucide-react)
## 🤝 Contributing
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
## 📜 License
Distributed under the MIT License. See `LICENSE` for more information.
## 📞 Contact
Alex Rivera - [Email](mailto:[email protected])
Project Link: [Project](https://github.com/stephenombuya/graphic-designer-portfolio/tree/main)