lucassedberg.com
By: Lucas Sedberg
Introduction
This website started as a simple idea. I wanted to create my own little repository of knowledge and experiences, where big and small, stupid and professional ideas could come to life with art of code.
This website is the result of that idea. It’s a place where I can share my thoughts, projects, and experiences with the world.
The Stack
SvelteKit
The choice of SvelteKit was a no-brainer for me, as I’ve been using Svelte for a while now and I love it. Coming from a jQuery and React background, Svelte was a such a refreshing experience. It’s simple, fast, and easy to use, with minimal boilerplate and a great developer experience.
TailwindCSS
TailwindCSS is a CSS framework that removes the need for writing custom CSS. It works well with Svelte, is easy to use when you get the hang of it, and is highly customizable.
Markdown
Though writing in Svelte is quick and easy, I’ve still chosen to implement Markdown (with mdsvex) for the dev posts. This makes me able to write posts without worrying about layout and design inconsistencies.
TypeScript
I’ve always been a fan of strict and typed languages, and since most of the web is running on JavaScript, and it is a langauge I am quite familiar with, TypeScript was a natural choice for me.
When setting up a new SvelteKit project, TypeScript is an option in the CLI, and SvelteKit has great TypeScript support.
GitHub Pages
GitHub Pages is a great way to host static websites for free. It’s easy to set up and works well with GitHub Actions.
The only downside is that it only supports static websites,
but when using SvelteKit, this is not a problem,
as it can be built to a static website using the adapter-static
adapter.
GitHub Actions
GitHub Actions is a great way to automate tasks. I followed this guide by svelterust.com to set up automatic deployment to GitHub Pages.
I did some tweaks. In the pages settings I set the Build and deployment
Source
to Github Actions (beta)
instead of Deploy from a branch
.
And I also removed path: dist
from the deploy.yml
file,
as it was not needed as I deployed my website to a custom domain.
All I have to do is push to the main
branch,
and the new changes are built to a static website project and automatically deployed to GitHub Pages.
Details
More details about the website will be added here in the future.
Stay tuned!
Future Plans
I’ve got plenty of ideas for the website itself, along with posts and projects for it.
Stay tuned for more updates!
Conclusion
There you have it. A simple and fast website built with SvelteKit and TailwindCSS, deployed to GitHub Pages with GitHub Actions.
This website is still work in progress, and plenty more is to come!