π§π»βπ» My personal website
An attempt to create a miniminal js personal blog using Astro.
π Stack
- Platform: Astro
- Deployment: Vercel
- Package manager: pnpm
- CSS: Tailwind CSS
π Project Structure
Inside of my Astro project, you'll see the following folders and files:
βββ .vscode/
βββ public/
β βββfavicon/
β βββ banner.png
β βββ robots.txt
β βββ sc1.png
βββ src/
β βββ assets/
β βββ components/
β βββ content/
β βββ layouts/
β βββ pages/
β βββ styles/
β βββ utils/
βββ .env.example
βββ .eslintrc.cjs
βββ .gitignore
βββ .LICENSE
βββ README.md
βββ astro.config.ts
βββ package-json
βββ pnpm-lock.yaml
βββ tailwind.config.js
βββ tsconfig.json
Astro looks for .astro
or .md
files in the src/pages/
directory. Each page
is exposed as a route based on its file name.
There's nothing special about src/components/
, but that's where you should
place any Astro/React/Vue/Svelte/Preact components.
Any static assets, like images, can be placed in the public/
directory.
This project uses Tailwind CSS for styling. The
tailwind.config.js
file is where you can customize your Tailwind theme.
I'm using the assets
folder to store my images and the content
folder to
store my markdown files so I can take advantage of Astro's built-in image
optimization.
π§ Running Locally
This app requires Node.js v18.4.1 or later.
git clone git@github.com:dreyfus92/astro-portfolio.git
cd astro-portfolio
npm install -g pnpm
pnpm i
pnpm dev
π License
This project is licensed under the MIT license.