<div align="center"> <img alt="logo" src="/public/favicon.svg" width="100" /> </div> <h1 align="center"> <a href="https://kjelsrud.dev">kjelsrud.dev</a> </h1> <p align="center"> The third iteration of my personal website, built with <a href="https://astro.build/">Astro</a>. </p> ## 📝 Info ### What I've learned from the project so far Through this project, I've learned HTML, CSS, TypeScript coding, SSG/frameworks like Hugo or Astro usage, Git version control, self-hosting websites with Caddy, Github Actions + Pages basics, creating faster, more secure, and maintainable websites, template-based static website generation, DNS pointers (A- & CNAME records) utilization, static website layout creation, and JSON-docs writing for data usage. ### Features - Blog - Bookmarks - Connect - CV - Digital garden - Gallery - Guestbook - Logs - Now - Uses - Vinyl collection - Worldmap ### Future plans: - [ ] Food wall with recipes - [ ] Page filled with quotes I like - [ ] Page filled with wine/gin I like - [ ] A page dedicated to work I'm proud of - [ ] Wishlist page ## 🛠️ How do I run it locally? 1. Install the dependencies: `yarn` 2. 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".