EV0 Astro Theme is a free and open-source serverless blog template, built with Astro, Tailwind CSS, and TypeScript. It serves as a starting point for creating your personal portfolio website or showcasing your projects online. The template is open-source and released under the MIT license, meaning you are free to use, modify, and distribute it for personal or commercial purposes.
- โ Minimal styling (Tailwind CSS)
- โ 100/100 Lighthouse performance
- โ SEO-friendly with canonical URLs and OpenGraph data
- โ Dark Mode
- โ Sitemap support
- โ RSS Feed support
- โ Markdown & MDX support
- โ View Transitions
- โ PWA-ready
- โ Fully responsive
- โ Robots.txt & Humans.txt
- โ TypeScript support
- โ Syntax highlighting
- โ YouTube Integration
- โ CLI for adding new posts
Includes personalized assistance via messages/emails, customization of up to 1 feature, assistance for implementation in your hosting and deployment, and advice for future changes. Buy VIP Support.
Clone this repository to your local machine using Git.
git clone https://github.com/gndx/ev0-astro-theme.git your-project-name
Command | Action |
---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:4321 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
npm run youtube |
Fetches the Latest YouTube Channel Videos |
npm run newpost |
Generate a New Blogpost Markdown Entry |
Edit the HTML files in the src/pages
directory to add your projects, experiences, and personal information.
To configure your blog, edit the src/config/config.json
file. This file contains the following options:
{
"site": {
"title": "EV0 Astro Theme",
"base_url": "https://ev0.gndx.dev/",
"base_path": "/",
"favicon": "/favicon.png",
"logo": "https://s3.amazonaws.com/gndx.dev/ev0-astro-logo.png",
"lang": "en",
"description": "EV0 is a free and open-source serverless blog template, built with Astro, Tailwind CSS, and TypeScript.",
"pageSize": 6
},
"features": {
"youtube": true
},
"metadata": {
"meta_author": "Oscar Barajas @gndx",
"meta_description": "EV0 is a free and open-source serverless blog template, built with Astro, Tailwind CSS, and TypeScript."
},
"author": {
"name": "Oscar Barajas Tavares @gndx",
"avatar": "https://s3.amazonaws.com/gndx.dev/gndx-astro-avatar.png",
"bio": "EV0 is a free and open-source serverless blog template, built with Astro, Tailwind CSS, and TypeScript."
}
}
The menu is configured in the src/config/menu.json
file. This file contains the following options:
[
{
"name": "Home",
"url": "/"
},
{
"name": "Blog",
"url": "/blog"
},
]
Social networks are configured in the src/config/social.json
file. This file contains the following options:
{
"name": "Instagram",
"url": "https://instagram.com/gndx"
"svg": "...."
}
To integrate your YouTube channel, you need to create a new file called .env
in the root directory of your project. Then add the CHANNEL_ID
and API_KEY
to get the latest videos from your YouTube channel in src/config/youtube.json
.
npm run youtube
Your YouTube API is not used in production.
Requires an API KEY for YouTube API V3 - Google Console
You can disable the youtube integration by modifying the src/config/config.json
.
"features": {
"youtube": false
},
To add a new post, run the following command:
npm run newpost
Follow the instructions and this will generate a new markdown file in the src/content/blog
directory. Edit the file to add your post content.
/
โโโ public/
โ โโโ favicons/
โ โโโ fonts/
โ โโโ blog-placeholder.jpg
โ โโโ favicon.png
โ โโโ humans.txt
โโโ scripts/
โ โโโ youtube.cjs
โโโ src/
โ โโโ components/
โ โโโ config/
โ โโโ content/
โ โโโ layouts/
โ โโโ pages/
โ โโโ styles/
โ โโโ env.d.ts
โโโ package.json
โโโ astro.config.mjs
โโโ tailwind.config.js
โโโ tsconfig.json
โโโ .gitignore
Contributions to this project are welcome. If you find a bug or have a suggestion for improvement, please open an issue or submit a pull request.
Oscar Barajas Tavares ๐ |
Jhon Achata Limachi ๐ ๐ค |
Erasmo Hernรกndez ๐ |
Francisco Araujo ๐จ ๐ |
This project is licensed under the MIT License. See the LICENSE
file for details.
If this project helped you learn something new, or if you're feeling particularly generous, you can buy me a coffee. It's greatly appreciated! ๐ GitHub Sponsors