Skip to content

Commit 308dcd3

Browse files
LadyKerrLadyKerr
authored
Merge pull request #1 from github-samples/init
chore: initialize Next.js project with TypeScript and Tailwind CSS
2 parents 525cd8e + 819f930 commit 308dcd3

24 files changed

Lines changed: 7459 additions & 2 deletions

‎.github/copilot-instructions.md‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
# Copilot Instructions for Gitfolio
2+
3+
## Project Overview
4+
Gitfolio is a **single-page portfolio template** for developers. All user-customizable content lives in `app/page.tsx`. This is a beginner-friendly template—keep changes simple and well-commented.
5+
6+
## Architecture
7+
8+
### Single-File Content Model
9+
- **`app/page.tsx`** - Contains ALL portfolio content and components (nav, hero, projects, about, contact, footer)
10+
- Components are defined at bottom of file: `ProjectCard`, `SocialLink`, `ArrowRightIcon`, `ArrowUpRightIcon`
11+
- No separate component files—intentionally flat for beginner accessibility
12+
13+
### GitHub Pages Deployment Pattern
14+
This project uses a **dual-environment basePath** pattern for local dev + GitHub Pages:
15+
16+
```tsx
17+
// In page.tsx - for images
18+
const basePath = process.env.NODE_ENV === "production" ? "/gfbs3-portfolio-demo" : "";
19+
src={`${basePath}/me.png`}
20+
21+
// In next.config.ts - for routing
22+
basePath: isProd ? "/gfbs3-portfolio-demo" : "",
23+
```
24+
25+
**Critical**: When users fork this repo, they must update the repo name in BOTH files.
26+
27+
## Design System
28+
29+
### Color Palette (Tailwind classes)
30+
| Color | Primary Use | Tailwind Classes |
31+
|-------|-------------|------------------|
32+
| Cyan | Links, accents, tech | `cyan-400`, `cyan-500`, `cyan-700` |
33+
| Fuchsia | Highlights, emphasis | `fuchsia-400`, `fuchsia-500`, `fuchsia-600` |
34+
| Yellow | CTAs, warnings | `yellow-400`, `yellow-500` |
35+
| Purple | Gradients | `purple-400`, `purple-500` |
36+
37+
### Glow Effects Pattern
38+
```tsx
39+
// Text glow
40+
className="drop-shadow-[0_0_8px_rgba(34,211,238,0.6)]"
41+
42+
// Box glow on hover
43+
className="hover:shadow-[0_0_20px_rgba(34,211,238,0.4)]"
44+
```
45+
46+
### ProjectCard Component
47+
```tsx
48+
<ProjectCard
49+
title="PROJECT_NAME" // UPPERCASE_SNAKE_CASE convention
50+
description="..."
51+
tags={["REACT", "API"]} // Uppercase tags
52+
color="cyan" // cyan | fuchsia | purple | yellow
53+
href="https://..."
54+
/>
55+
```
56+
57+
## Key Files
58+
59+
| File | Purpose |
60+
|------|---------|
61+
| `app/page.tsx` | All content + components |
62+
| `app/layout.tsx` | Metadata, fonts (Geist) |
63+
| `app/globals.css` | Tailwind imports only |
64+
| `next.config.ts` | Static export + basePath |
65+
| `.github/workflows/deploy.yml` | GitHub Pages CI/CD |
66+
| `public/me.png` | Profile image location |
67+
68+
## Commands
69+
```bash
70+
npm run dev # Local development at localhost:3000
71+
npm run build # Production build (static export to /out)
72+
npm run lint # ESLint check
73+
```
74+
75+
## When Helping Users
76+
77+
1. **Content changes** → Edit `app/page.tsx` only
78+
2. **Adding images** → Place in `/public`, use `${basePath}/filename` pattern
79+
3. **Deployment issues** → Check basePath matches repo name in both config files
80+
4. **Styling** → Use existing Tailwind classes; maintain cyberpunk aesthetic
81+
5. **New sections** → Follow existing section pattern with `id` for nav linking

‎.github/workflows/deploy.yml‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
# Sample workflow for building and deploying a Next.js site to GitHub Pages
2+
#
3+
# To get started with Next.js see: https://nextjs.org/docs/getting-started
4+
#
5+
name: Deploy Next.js site to Pages
6+
7+
on:
8+
# Runs on pushes targeting the default branch
9+
push:
10+
branches: ["main"]
11+
12+
# Allows you to run this workflow manually from the Actions tab
13+
workflow_dispatch:
14+
15+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
16+
permissions:
17+
contents: read
18+
pages: write
19+
id-token: write
20+
21+
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
22+
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
23+
concurrency:
24+
group: "pages"
25+
cancel-in-progress: false
26+
27+
jobs:
28+
# Build job
29+
build:
30+
runs-on: ubuntu-latest
31+
steps:
32+
- name: Checkout
33+
uses: actions/checkout@v4
34+
- name: Detect package manager
35+
id: detect-package-manager
36+
run: |
37+
if [ -f "${{ github.workspace }}/yarn.lock" ]; then
38+
echo "manager=yarn" >> $GITHUB_OUTPUT
39+
echo "command=install" >> $GITHUB_OUTPUT
40+
echo "runner=yarn" >> $GITHUB_OUTPUT
41+
exit 0
42+
elif [ -f "${{ github.workspace }}/package.json" ]; then
43+
echo "manager=npm" >> $GITHUB_OUTPUT
44+
echo "command=ci" >> $GITHUB_OUTPUT
45+
echo "runner=npx --no-install" >> $GITHUB_OUTPUT
46+
exit 0
47+
else
48+
echo "Unable to determine package manager"
49+
exit 1
50+
fi
51+
- name: Setup Node
52+
uses: actions/setup-node@v4
53+
with:
54+
node-version: "20"
55+
cache: ${{ steps.detect-package-manager.outputs.manager }}
56+
- name: Setup Pages
57+
uses: actions/configure-pages@v5
58+
with:
59+
# Automatically inject basePath in your Next.js configuration file and disable
60+
# server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
61+
#
62+
# You may remove this line if you want to manage the configuration yourself.
63+
static_site_generator: next
64+
- name: Restore cache
65+
uses: actions/cache@v4
66+
with:
67+
path: |
68+
.next/cache
69+
# Generate a new cache whenever packages or source files change.
70+
key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
71+
# If source files changed but packages didn't, rebuild from a prior cache.
72+
restore-keys: |
73+
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
74+
- name: Install dependencies
75+
run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
76+
- name: Build with Next.js
77+
run: ${{ steps.detect-package-manager.outputs.runner }} next build
78+
- name: Upload artifact
79+
uses: actions/upload-pages-artifact@v3
80+
with:
81+
path: ./out
82+
83+
# Deployment job
84+
deploy:
85+
environment:
86+
name: github-pages
87+
url: ${{ steps.deployment.outputs.page_url }}
88+
runs-on: ubuntu-latest
89+
needs: build
90+
steps:
91+
- name: Deploy to GitHub Pages
92+
id: deployment
93+
uses: actions/deploy-pages@v4

‎CODE_OF_CONDUCT.md‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
# Contributor Covenant Code of Conduct
2+
3+
## Our Pledge
4+
5+
In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to make participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, sex, sexual characteristics, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, or sexual identity and orientation.
6+
7+
## Our Standards
8+
9+
Examples of behavior that contributes to creating a positive environment include:
10+
11+
* Using welcoming and inclusive language
12+
* Being respectful of differing viewpoints and experiences
13+
* Gracefully accepting constructive criticism
14+
* Focusing on what is best for the community
15+
* Showing empathy towards other community members
16+
17+
Examples of unacceptable behavior by participants include:
18+
19+
* The use of sexualized language or imagery and unwelcome sexual attention or advances
20+
* Trolling, insulting/derogatory comments, and personal or political attacks
21+
* Public or private harassment
22+
* Publishing others' private information, such as a physical or electronic address, without explicit permission
23+
* Other conduct which could reasonably be considered inappropriate in a professional setting
24+
25+
## Our Responsibilities
26+
27+
Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
28+
29+
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
30+
31+
## Scope
32+
33+
This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
34+
35+
## Enforcement
36+
37+
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at opensource@github.com. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
38+
39+
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
40+
41+
## Attribution
42+
43+
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html

‎CONTRIBUTING.md‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
# Contributing to Gitfolio
2+
3+
First off, thanks for taking the time to contribute! 🎉
4+
5+
The following is a set of guidelines for contributing to this project. These are mostly guidelines, not rules. Use your best judgment and feel free to propose changes to this document in a pull request.
6+
7+
## 🚀 Getting Started
8+
9+
1. **Fork the repository** on GitHub.
10+
2. **Clone your fork** locally:
11+
```bash
12+
git clone https://github.com/your-username/gfbs3-portfolio-demo.git
13+
cd gfbs3-portfolio-demo
14+
```
15+
3. **Install dependencies**:
16+
```bash
17+
npm install
18+
```
19+
4. **Run the development server**:
20+
```bash
21+
npm run dev
22+
```
23+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
24+
25+
## 🛠️ Development Workflow
26+
27+
1. Create a new branch for your feature or fix:
28+
```bash
29+
git checkout -b feature/amazing-feature
30+
```
31+
2. Make your changes.
32+
3. **Lint your code** to ensure it meets the project's standards:
33+
```bash
34+
npm run lint
35+
```
36+
4. Commit your changes with a descriptive message.
37+
38+
## 🎨 Style Guidelines
39+
40+
* **Aesthetic:** Maintain the "Retro-Futuristic" / Cyberpunk 1985 vibe.
41+
* **Tailwind CSS:** Use utility classes for styling.
42+
* **Colors:** Stick to the defined palette (Cyan, Fuchsia, Yellow, Deep Space Black).
43+
* **Typography:** Use `font-mono` for text elements.
44+
45+
## 📬 Submitting a Pull Request
46+
47+
1. Push your branch to your fork:
48+
```bash
49+
git push origin feature/amazing-feature
50+
```
51+
2. Open a Pull Request on the original repository.
52+
3. Provide a clear description of the changes and why they are necessary.
53+
4. Wait for review!
54+
55+
## 🤝 Code of Conduct
56+
57+
Please note that this project is released with a [Contributor Code of Conduct](CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms. Be kind and respectful to others.

0 commit comments

Comments
 (0)