Skip to content

Commit b3a485d

Browse files
ArpitRajputGithubArpitRajputGithub
committed
docs: add landing page (astro + tailwind) and VHS tape
1 parent 9157dc2 commit b3a485d

13 files changed

Lines changed: 5684 additions & 0 deletions

File tree

‎demo.tape‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# VHS tape → demo.gif
2+
# Install VHS (one time): brew install vhs
3+
# Render: vhs demo.tape
4+
5+
Output demo.gif
6+
7+
# ── canvas ────────────────────────────────────
8+
Set FontSize 20
9+
Set Width 1400
10+
Set Height 800
11+
Set Padding 30
12+
Set Theme "Catppuccin Mocha"
13+
Set TypingSpeed 60ms
14+
Set Framerate 30
15+
Set PlaybackSpeed 1.0
16+
17+
# ── scene ─────────────────────────────────────
18+
# Assumes a dummy dev server is already running on :5173 in a
19+
# separate process. Easiest: `python3 -m http.server 5173`.
20+
21+
Type "httpsdev --tui 5173"
22+
Sleep 500ms
23+
Enter
24+
Sleep 2s
25+
26+
# Simulate a few incoming requests to make the feed populate.
27+
# Requires a helper that hits localhost:3443 while VHS records —
28+
# either open a browser tab manually or run in another shell:
29+
# for i in {1..6}; do curl -sk https://localhost:3443/ > /dev/null; sleep 0.5; done
30+
31+
Sleep 8s
32+
33+
# Wave goodbye
34+
Type "q"
35+
Sleep 500ms

‎web/.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# build output
2+
dist/
3+
# generated types
4+
.astro/
5+
6+
# dependencies
7+
node_modules/
8+
9+
# logs
10+
npm-debug.log*
11+
yarn-debug.log*
12+
yarn-error.log*
13+
pnpm-debug.log*
14+
15+
16+
# environment variables
17+
.env
18+
.env.production
19+
20+
# macOS-specific files
21+
.DS_Store
22+
23+
# jetbrains setting folder
24+
.idea/

‎web/AGENTS.md‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
## Development
2+
3+
When starting the dev server, use background mode:
4+
5+
```
6+
astro dev --background
7+
```
8+
9+
Manage the background server with `astro dev stop`, `astro dev status`, and `astro dev logs`.
10+
11+
## Documentation
12+
13+
Full documentation: https://docs.astro.build
14+
15+
Consult these guides before working on related tasks:
16+
17+
- [Adding pages, dynamic routes, or middleware](https://docs.astro.build/en/guides/routing/)
18+
- [Working with Astro components](https://docs.astro.build/en/basics/astro-components/)
19+
- [Using React, Vue, Svelte, or other framework components](https://docs.astro.build/en/guides/framework-components/)
20+
- [Adding or managing content](https://docs.astro.build/en/guides/content-collections/)
21+
- [Adding styles or using Tailwind](https://docs.astro.build/en/guides/styling/)
22+
- [Supporting multiple languages](https://docs.astro.build/en/guides/internationalization/)

‎web/DEPLOY.md‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
# Deploying the landing page to Cloudflare Pages
2+
3+
The site lives in `web/`. Cloudflare Pages watches the `main` branch and rebuilds automatically on every push. No GitHub Actions workflow required — Cloudflare's own CI does the build.
4+
5+
## One-time setup (~2 minutes)
6+
7+
1. Sign in at [dash.cloudflare.com](https://dash.cloudflare.com/) (free account).
8+
2. **Workers & Pages → Create → Pages → Connect to Git.**
9+
3. Authorize Cloudflare for the `ArpitRajputGithub` account, pick the `httpsdev` repo.
10+
4. **Set up builds and deployments:**
11+
12+
| Field | Value |
13+
|-------|-------|
14+
| Framework preset | Astro |
15+
| Build command | `npm run build` |
16+
| Build output directory | `dist` |
17+
| Root directory | `web` |
18+
| Node version | `22` (set via env var `NODE_VERSION` → `22`) |
19+
20+
5. **Save and Deploy.** First build takes ~90s.
21+
6. Live at `httpsdev.pages.dev` (or `<some-hash>.httpsdev.pages.dev` on preview branches).
22+
23+
## Custom domain (optional, when ready)
24+
25+
- Buy a domain — [Porkbun](https://porkbun.com/) has `.dev` for ~$10/yr.
26+
- **Pages project → Custom domains → Set up a custom domain.** Cloudflare handles SSL and DNS automatically if the domain is on their nameservers.
27+
- Suggested: `httpsdev.dev`.
28+
29+
## Preview deployments
30+
31+
Every branch and PR gets its own preview URL — great for reviewing landing page changes before merging.
32+
33+
## Local dev
34+
35+
```bash
36+
cd web
37+
npm run dev # http://localhost:4321
38+
npm run build # writes dist/
39+
npm run preview # serves dist/ locally
40+
```
41+
42+
## Why Cloudflare Pages over GitHub Pages
43+
44+
- Unlimited bandwidth (GH Pages soft-caps at 100 GB/month).
45+
- Faster CDN (Cloudflare's edge > GitHub's Fastly).
46+
- Cleaner URL (`httpsdev.pages.dev` vs `arpitrajputgithub.github.io/httpsdev`).
47+
- Automatic preview URLs per branch.
48+
49+
## Emergency fallback: GitHub Pages
50+
51+
If Cloudflare setup blocks you, GH Pages works with a one-liner workflow:
52+
53+
```yaml
54+
# .github/workflows/deploy-web.yml
55+
name: deploy-web
56+
on:
57+
push:
58+
branches: [main]
59+
paths: [web/**]
60+
jobs:
61+
build:
62+
runs-on: ubuntu-latest
63+
steps:
64+
- uses: actions/checkout@v4
65+
- uses: actions/setup-node@v4
66+
with: { node-version: '22' }
67+
- run: cd web && npm ci && npm run build
68+
- uses: actions/upload-pages-artifact@v3
69+
with: { path: web/dist }
70+
deploy:
71+
needs: build
72+
permissions: { pages: write, id-token: write }
73+
runs-on: ubuntu-latest
74+
steps:
75+
- uses: actions/deploy-pages@v4
76+
```
77+
78+
Then in the repo's Settings → Pages → Source: "GitHub Actions".

‎web/README.md‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
# Astro Starter Kit: Minimal
2+
3+
```sh
4+
npm create astro@latest -- --template minimal
5+
```
6+
7+
> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
8+
9+
## 🚀 Project Structure
10+
11+
Inside of your Astro project, you'll see the following folders and files:
12+
13+
```text
14+
/
15+
├── public/
16+
├── src/
17+
│ └── pages/
18+
│ └── index.astro
19+
└── package.json
20+
```
21+
22+
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
23+
24+
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
25+
26+
Any static assets, like images, can be placed in the `public/` directory.
27+
28+
## 🧞 Commands
29+
30+
All commands are run from the root of the project, from a terminal:
31+
32+
| Command | Action |
33+
| :------------------------ | :----------------------------------------------- |
34+
| `npm install` | Installs dependencies |
35+
| `npm run dev` | Starts local dev server at `localhost:4321` |
36+
| `npm run build` | Build your production site to `./dist/` |
37+
| `npm run preview` | Preview your build locally, before deploying |
38+
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
39+
| `npm run astro -- --help` | Get help using the Astro CLI |
40+
41+
## 👀 Want to learn more?
42+
43+
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

‎web/astro.config.mjs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// @ts-check
2+
import { defineConfig } from 'astro/config';
3+
4+
import tailwindcss from '@tailwindcss/vite';
5+
6+
// https://astro.build/config
7+
export default defineConfig({
8+
vite: {
9+
plugins: [tailwindcss()]
10+
}
11+
});

0 commit comments

Comments
 (0)