Skip to content

Commit 3cd3a16

Browse files
committed
chore: Yeah my first commit
0 parents  commit 3cd3a16

13 files changed

Lines changed: 5118 additions & 0 deletions

File tree

.github/workflows/deploy.yml

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
name: Deploy to GitHub Pages
2+
3+
on:
4+
push:
5+
branches: [ main ]
6+
workflow_dispatch:
7+
8+
concurrency:
9+
group: "pages"
10+
cancel-in-progress: true
11+
12+
jobs:
13+
build:
14+
runs-on: ubuntu-latest
15+
steps:
16+
- name: Checkout your repository using git
17+
uses: actions/checkout@v4
18+
- name: Setup Pages
19+
uses: actions/configure-pages@v5
20+
- name: Install, build, and upload your site
21+
uses: withastro/action@v4
22+
23+
deploy:
24+
needs: build
25+
runs-on: ubuntu-latest
26+
permissions:
27+
pages: write
28+
id-token: write
29+
environment:
30+
name: github-pages
31+
url: ${{ steps.deployment.outputs.page_url }}
32+
steps:
33+
- name: Deploy to GitHub Pages
34+
id: deployment
35+
uses: actions/deploy-pages@v4

.gitignore

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# Node
2+
node_modules/
3+
4+
# Astro build output
5+
dist/
6+
.astro/
7+
8+
# VS Code
9+
.vscode/
10+
11+
# OS
12+
.DS_Store
13+
Thumbs.db
14+
15+
# Logs
16+
npm-debug.log*
17+
yarn-debug.log*
18+
yarn-error.log*
19+
20+
# Env
21+
.env
22+
.env.*
23+
24+
# Misc
25+
*.local
26+
*.log
27+
28+
# Mac system files
29+
Icon?
30+
31+
# Windows system files
32+
Desktop.ini

README.md

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
# Simple Astro Website
2+
3+
This project is a simple website built with [Astro](https://astro.build/), generated by Gemini Code Assist. It demonstrates several best practices for structuring and building modern web applications.
4+
5+
## How to Run This Project
6+
7+
1. **Install Dependencies**:
8+
```bash
9+
npm install
10+
```
11+
12+
2. **Run the Development Server**:
13+
```bash
14+
npm run dev
15+
```
16+
This will start a local development server. You can view your site in the browser at the URL provided in your terminal (usually `http://localhost:4321`).
17+
18+
3. **Build for Production**:
19+
```bash
20+
npm run build
21+
```
22+
This command builds your site into the `dist/` directory, ready for deployment.
23+
24+
## Best Practices Implemented
25+
26+
Here are some of the best practices used in this project's structure and code:
27+
28+
### 1. Project Structure
29+
30+
The project follows a standard Astro directory structure, which helps keep the code organized and maintainable.
31+
32+
- `src/`: Contains all of your source code that will be processed by Astro.
33+
- `src/pages/`: **File-based Routing**. Every `.astro`, `.md`, or `.js`/`.ts` file in this directory becomes a page on your website. For example, `src/pages/index.astro` is the homepage.
34+
- `src/layouts/`: Contains layout components. Layouts are special `.astro` components that wrap page content, providing a consistent structure (like headers, footers, and navigation).
35+
- `src/styles/`: A dedicated directory for CSS files. This project uses a `global.css` for site-wide styles.
36+
- `public/`: For static assets that don't need to be processed, like `favicon.svg`, images, or fonts. Files here are copied directly to the build output.
37+
38+
### 2. Component-Based Architecture
39+
40+
Astro is a component-based framework. This project uses:
41+
42+
- **Page Components** (`src/pages/index.astro`): These are responsible for the content of a specific page.
43+
- **Layout Components** (`src/layouts/Layout.astro`): These define the reusable HTML shell for pages. The `<slot />` element is a placeholder where the content from the page component is injected. This promotes code reuse and separation of concerns.
44+
45+
### 3. Zero JavaScript by Default
46+
47+
One of Astro's core principles is to ship as little JavaScript as possible. The generated HTML is fully static and interactive elements can be opted into using Astro Islands. This project, being simple, ships 0 KB of client-side JavaScript, making it extremely fast to load.
48+
49+
### 4. Styling
50+
51+
- **Global Stylesheet**: A `global.css` file is used for base styles, CSS variables (custom properties), and resets. This ensures a consistent look and feel across the entire site.
52+
- **Scoped Styles**: While not used in this simple example, Astro supports scoped styling by default. A `<style>` tag inside an `.astro` component will only apply to the HTML elements within that component, preventing CSS conflicts.
53+
54+
### 5. TypeScript Integration
55+
56+
The project is set up with a `tsconfig.json` that extends Astro's base configuration. This provides type safety and improved developer experience with autocompletion and error checking, even within `.astro` files. The `Layout.astro` component uses a TypeScript `interface` to define its expected props.

astro.config.mjs

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { defineConfig } from 'astro/config';
2+
3+
// https://astro.build/config
4+
export default defineConfig({});

0 commit comments

Comments
 (0)