Skip to content

Commit a46ff79

Browse files
Copilotsyed-reza98
Copilot
and
syed-reza98
committed
Complete Phase 1: Next.js boilerplate with Tailwind CSS, Radix UI, and basic pages
Co-authored-by: syed-reza98 <71028588+syed-reza98@users.noreply.github.com>
1 parent 5b6988e commit a46ff79

27 files changed

Lines changed: 8090 additions & 5 deletions

‎.gitignore‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,12 @@
33
# dependencies
44
/node_modules
55
/.pnp
6-
.pnp.js
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
712

813
# testing
914
/coverage
@@ -23,10 +28,10 @@
2328
npm-debug.log*
2429
yarn-debug.log*
2530
yarn-error.log*
31+
.pnpm-debug.log*
2632

27-
# local env files
28-
.env*.local
29-
.env
33+
# env files (can opt-in for committing if needed)
34+
.env*
3035

3136
# vercel
3237
.vercel

‎CONTRIBUTING.md‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
# Contributing to CodeStorm Hub Portfolio
2+
3+
We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's:
4+
5+
- Reporting a bug
6+
- Discussing the current state of the code
7+
- Submitting a fix
8+
- Proposing new features
9+
- Becoming a maintainer
10+
11+
## Development Process
12+
13+
We use GitHub to host code, to track issues and feature requests, as well as accept pull requests.
14+
15+
## Pull Request Process
16+
17+
1. Fork the repository and create your branch from `main`
18+
2. If you've added code that should be tested, add tests
19+
3. If you've changed APIs, update the documentation
20+
4. Ensure the test suite passes
21+
5. Make sure your code lints
22+
6. Issue that pull request!
23+
24+
## Local Development
25+
26+
### Prerequisites
27+
28+
- Node.js 18.0 or later
29+
- npm 8.0 or later
30+
31+
### Setup
32+
33+
1. Clone the repository:
34+
```bash
35+
git clone https://github.com/CodeStorm-Hub/CodeStorm-Hub.github.io.git
36+
cd CodeStorm-Hub.github.io
37+
```
38+
39+
2. Install dependencies:
40+
```bash
41+
npm install
42+
```
43+
44+
3. Start the development server:
45+
```bash
46+
npm run dev
47+
```
48+
49+
4. Open [http://localhost:3000](http://localhost:3000) in your browser
50+
51+
### Available Scripts
52+
53+
- `npm run dev` - Start development server
54+
- `npm run build` - Build for production
55+
- `npm run start` - Start production server
56+
- `npm run lint` - Run ESLint
57+
58+
### Project Structure
59+
60+
```
61+
src/
62+
├── app/ # Next.js App Router pages
63+
│ ├── globals.css # Global styles and design tokens
64+
│ ├── layout.tsx # Root layout component
65+
│ └── page.tsx # Homepage
66+
├── components/ # Reusable UI components
67+
│ ├── ui/ # Basic UI components (Button, Card, etc.)
68+
│ └── layout/ # Layout components (Header, Footer)
69+
└── lib/ # Utilities and configurations
70+
└── utils.ts # Utility functions
71+
```
72+
73+
## Design System
74+
75+
This project uses a comprehensive design system based on:
76+
77+
- **Colors**: Radix Colors for consistent, accessible color palettes
78+
- **Components**: Radix UI Primitives for accessible, unstyled components
79+
- **Styling**: Tailwind CSS for utility-first styling
80+
- **Typography**: Geist font family for modern, readable text
81+
82+
### Component Guidelines
83+
84+
- Use Radix UI primitives as the foundation for complex components
85+
- Follow the established color tokens and spacing scale
86+
- Ensure all components are accessible (ARIA labels, keyboard navigation)
87+
- Use TypeScript for all components with proper prop types
88+
89+
## Code Style
90+
91+
We use ESLint and Prettier to maintain consistent code style:
92+
93+
- Use TypeScript for all new code
94+
- Follow the established ESLint configuration
95+
- Use meaningful variable and function names
96+
- Add JSDoc comments for complex functions
97+
- Keep components small and focused
98+
99+
## Commit Convention
100+
101+
We follow the [Conventional Commits](https://www.conventionalcommits.org/) specification:
102+
103+
- `feat:` for new features
104+
- `fix:` for bug fixes
105+
- `docs:` for documentation changes
106+
- `style:` for formatting changes
107+
- `refactor:` for code refactoring
108+
- `test:` for adding tests
109+
- `chore:` for maintenance tasks
110+
111+
## License
112+
113+
By contributing, you agree that your contributions will be licensed under the BSD 3-Clause License.
114+
115+
## References
116+
117+
This project is inspired by and follows best practices from:
118+
119+
- [Vercel Design Engineering](https://vercel.com/solutions/design-engineering)
120+
- [Radix UI Design System](https://www.radix-ui.com/)
121+
- [Next.js Documentation](https://nextjs.org/docs)
122+
- [Tailwind CSS Best Practices](https://tailwindcss.com/docs/reusing-styles)

‎README.md‎

Lines changed: 61 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,62 @@
1-
# CodeStorm-Hub.github.io
1+
# CodeStorm Hub Portfolio Website
2+
23
CodeStorm Hub is a vibrant community of open source enthusiasts, researchers, and creators. We collaborate on powerful open-source solutions.
4+
5+
This is the official portfolio website built with Next.js, Tailwind CSS, and Radix UI, featuring a modern design system inspired by Vercel's design engineering practices.
6+
7+
## Tech Stack
8+
9+
- **Framework**: [Next.js 15](https://nextjs.org) with App Router
10+
- **Styling**: [Tailwind CSS 4](https://tailwindcss.com)
11+
- **Components**: [Radix UI](https://www.radix-ui.com)
12+
- **Typography**: [Geist Font](https://vercel.com/font)
13+
- **Language**: TypeScript
14+
- **Deployment**: Vercel
15+
16+
## Getting Started
17+
18+
First, install dependencies:
19+
20+
```bash
21+
npm install
22+
```
23+
24+
Then, run the development server:
25+
26+
```bash
27+
npm run dev
28+
```
29+
30+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
31+
32+
## Project Structure
33+
34+
```
35+
src/
36+
├── app/ # Next.js App Router pages
37+
├── components/ # Reusable UI components
38+
├── lib/ # Utilities and configurations
39+
└── styles/ # Global styles and design tokens
40+
```
41+
42+
## Design System
43+
44+
This project implements a comprehensive design system based on:
45+
- [Radix Colors](https://www.radix-ui.com/colors) for consistent color palettes
46+
- [Radix UI Primitives](https://www.radix-ui.com/primitives) for accessible components
47+
- [Vercel Design](https://vercel.com/design) principles and patterns
48+
49+
## Development
50+
51+
- `npm run dev` - Start development server
52+
- `npm run build` - Build for production
53+
- `npm run start` - Start production server
54+
- `npm run lint` - Run ESLint
55+
56+
## Contributing
57+
58+
We welcome contributions! Please see our contributing guidelines for more details.
59+
60+
## License
61+
62+
This project is licensed under the BSD 3-Clause License - see the [LICENSE](LICENSE) file for details.

‎eslint.config.mjs‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { dirname } from "path";
2+
import { fileURLToPath } from "url";
3+
import { FlatCompat } from "@eslint/eslintrc";
4+
5+
const __filename = fileURLToPath(import.meta.url);
6+
const __dirname = dirname(__filename);
7+
8+
const compat = new FlatCompat({
9+
baseDirectory: __dirname,
10+
});
11+
12+
const eslintConfig = [
13+
...compat.extends("next/core-web-vitals", "next/typescript"),
14+
{
15+
ignores: [
16+
"node_modules/**",
17+
".next/**",
18+
"out/**",
19+
"build/**",
20+
"next-env.d.ts",
21+
],
22+
},
23+
];
24+
25+
export default eslintConfig;

‎next.config.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import type { NextConfig } from "next";
2+
3+
const nextConfig: NextConfig = {
4+
/* config options here */
5+
};
6+
7+
export default nextConfig;

0 commit comments

Comments
 (0)