Skip to content

daniele-salvagni/dan.salvagni.io

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation


This website is statically generated thanks to Astro, a new (1.0.0-rc.1 at the moment) all-in-one web framework for building fast, content-focused websites. Here are some of its features:

  • Component Islands: Interactive UI component on an otherwise static page of HTML.
  • Server-first API design: Astro renders directly to HTML & CSS, eliminating heavy JavaScript automatically.
  • Zero JS, by default: No JavaScript runtime overhead.
  • Edge-ready: Deploy anywhere, even a global edge runtime like Deno or Cloudflare.
  • UI-agnostic: Supports React, Preact, Svelte, Vue, Solid, Lit and more.

The folder structure of this website looks something like this:

.
β”œβ”€β”€ public/
β”‚   └── assets
└── src/
    β”œβ”€β”€ components/
    β”œβ”€β”€ layouts/
    β”œβ”€β”€ pages/
    β”œβ”€β”€ scripts/
    └── style/

Astro looks for .astro or .md files in the /src/pages/ directory. Each page is exposed as a route based on its file name. If the page has [brackets] in it's name it's a dynamic route.

Page layouts are in the src/layouts folder while src/components/ is where I put anything that I want to re-use inside pages. All client side JS is put into the src/scripts/ folder.

All global styles are in src/styles/ and written with SASS. Individual page or component styles are in each page or component file inside the <style> tags.

Every time a commit is pushed, GitHub Actions will build and deploy this website to an AWS S3 bucket.


βŒ› Old stack

The stack mentioned above is replacing the following one:

Gulp is used to automate the build process. The base of the site generator is Metalsmith, the stylesheets are compiled from SASS using the Bourbon library and Neat for the responsive grid. Templates are written with Handlebars and the content in Markdown with YAML frontmatter. Comments to the blog posts are retrieved from this repository's issue page using GitHub's API and rendered using Vue.js.

After a succesful build the website is automatically deployed by Travis on an AWS S3 bucket.

Last commit with the old stack on Github: 49d02f4