My personal website, coded with Astro 🧑🚀
|
|
||
|---|---|---|
| .github/workflows | ||
| public | ||
| src | ||
| .gitignore | ||
| astro.config.mjs | ||
| LICENSE | ||
| package.json | ||
| README.md | ||
| tailwind.config.cjs | ||
| tsconfig.json | ||
| yarn.lock | ||
kjelsrud.dev
The third iteration of my personal website, built with Astro.
📝 Info
What I've learned from the project so far
- Coding with HTML, CSS, TypeScript, etc.
- Usage of SSG/frameworks like Hugo or Astro
- How to use Git
- How to selfhost websites using Caddy
- Some understanding of Github Actions + Pages
- How to create websites that are faster, more secure, and easier to maintain
- How to use templates to generate static websites
- How to use DNS pointers (A- & CNAME records)
- How to create & use layouts for a static website
- How to write JSON-docs and use data from it
Features
- Blog
- Bookmarks
- Connect
- CV
- Digital garden
- Gallery
- Guestbook
- Logs
- Now
- Uses
- Vinyl collection
Future plans:
- Food wall
- Worldmap of places I've been
- Page filled with quotes I like
🛠️ How do I run it locally?
-
Install the dependencies:
yarn -
Start the development server:
yarn dev
🎨 Color codes
Light mode
| Color | Hex |
|---|---|
| Coffee Cream | #F7F0E8 |
| Espresso Text | #3B2C29 |
| Latte Secondary Text | #78605C |
| Cappuccino Accents | #A48B82 |
| Caramel Macchiato | #B08968 |
Dark mode
| Color | Hex |
|---|---|
| Deep Ocean | #0F1A1C |
| Mint Foam Text | #9AD3BB |
| Coral Reef Accent | #3A6F7F |
| Seaweed Highlight | #2B4F60 |
| Lagoon | #1A333F |
| Aquamarine | #7FCDCD |
Versionlog
- The first iteration of my website was plain html and css..
- The second iteration of my website was a Hugo-instance that used a readymade theme called "PaperMod".