Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ruchernchong/portfolio
Portfolio built with Contentlayer, Next.js, Tailwind CSS Typescript (T3 Stack), and deployed through Vercel
https://github.com/ruchernchong/portfolio
blog contentlayer graphql neon nextjs portfolio react redis tailwindcss typescript upstash upstash-redis vercel
Last synced: about 10 hours ago
JSON representation
Portfolio built with Contentlayer, Next.js, Tailwind CSS Typescript (T3 Stack), and deployed through Vercel
- Host: GitHub
- URL: https://github.com/ruchernchong/portfolio
- Owner: ruchernchong
- License: mit
- Created: 2022-12-19T06:19:42.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-13T18:40:54.000Z (7 days ago)
- Last Synced: 2025-01-13T18:45:24.843Z (7 days ago)
- Topics: blog, contentlayer, graphql, neon, nextjs, portfolio, react, redis, tailwindcss, typescript, upstash, upstash-redis, vercel
- Language: TypeScript
- Homepage: https://ruchern.dev
- Size: 88.3 MB
- Stars: 7
- Watchers: 1
- Forks: 1
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Personal Portfolio
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fruchernchong%2Fportfolio)
[](https://opensource.org/licenses/MIT)
Welcome to my portfolio website! Visit the live site at [ruchern.dev](https://ruchern.dev)
## 🚀 Tech Stack
This portfolio is built with modern web technologies:
- **Framework**: [Next.js](https://nextjs.org) - React framework for production
- **Styling**: [Tailwind CSS](https://tailwindcss.com) - Utility-first CSS framework
- **Database**: [Neon](https://neon.tech) - Serverless Postgres database
- **Deployment**: [Vercel](https://vercel.com) - Platform for frontend frameworks and static sites
## 🛠️ Getting Started
### Prerequisites
- Node.js 18.x or higher
- [pnpm](https://pnpm.io) package manager
### Installation
1. Clone the repository
```bash
git clone https://github.com/ruchernchong/portfolio.git
```
2. Navigate to the project directory
```bash
cd portfolio
```
3. Install dependencies
```bash
pnpm install
```
4. Set up environment variables
```bash
cp .env.example .env
```
5. Update the `.env` file with your own values
```env
# Upstash Redis
UPSTASH_REDIS_REST_URL=
UPSTASH_REDIS_REST_TOKEN=
```
6. Start the development server
```bash
pnpm dev
```
Your site should now be running at `http://localhost:3000`!
## 🔧 Configuration
### Environment Variables
The following environment variables are required to run the application:
| Variable | Description | Required |
| -------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- | -------- |
| `NEXT_PUBLIC_BASE_URL` | The base URL of your application (default: http://localhost:3000) | Yes |
| `DATABASE_URL` | Connection string for your Neon PostgreSQL database | Yes |
| `GH_ACCESS_TOKEN` | GitHub Personal Access Token for GitHub integration | Yes |
| `UPSTASH_REDIS_REST_URL` | The REST API endpoint URL for your Upstash Redis database. Found in your Upstash Redis console under "REST API" details | Yes |
| `UPSTASH_REDIS_REST_TOKEN` | Authentication token for accessing your Upstash Redis database via REST API. Found in your Upstash Redis console under "REST API" details | Yes |
| `IP_SALT` | Salt value used for IP address hashing | Yes |
Make sure to copy `.env.example` to `.env` and fill in the required values:
## 📝 Project Structure
```
portfolio/
├── app/ # Next.js app directory
├── components/ # React components
├── lib/ # Utility functions
└── public/ # Static assets
```
## 🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
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
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## 📫 Contact
[@ruchernchong](https://twitter.com/ruchernchong)
Project Link: [https://github.com/ruchernchong/portfolio](https://github.com/ruchernchong/portfolio)