commit 8f407a4c948a4a804441914207329e3982ff1456 Author: Siddhartha Date: Wed Oct 26 19:38:47 2022 +0530 started with blog template diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..02f6e50 --- /dev/null +++ b/.gitignore @@ -0,0 +1,19 @@ +# build output +dist/ + +# dependencies +node_modules/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 0000000..22a1505 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,4 @@ +{ + "recommendations": ["astro-build.astro-vscode"], + "unwantedRecommendations": [] +} diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..d642209 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,11 @@ +{ + "version": "0.2.0", + "configurations": [ + { + "command": "./node_modules/.bin/astro dev", + "name": "Development server", + "request": "launch", + "type": "node-terminal" + } + ] +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..32934f6 --- /dev/null +++ b/README.md @@ -0,0 +1,64 @@ +# Astro Starter Kit: Blog + +``` +npm create astro@latest -- --template blog +``` + +[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/blog) + +> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun! + + +![blog](https://user-images.githubusercontent.com/4677417/186189140-4ef17aac-c3c9-4918-a8c2-ce86ba1bb394.png) + +Features: + +- ✅ Minimal styling (make it your own!) +- ✅ 100/100 Lighthouse performance +- ✅ SEO-friendly with canonical URLs and OpenGraph data +- ✅ Sitemap support +- ✅ RSS Feed support +- ✅ Markdown & MDX support + +## 🚀 Project Structure + +Inside of your Astro project, you'll see the following folders and files: + +``` +├── public/ +├── src/ +│   ├── components/ +│   ├── layouts/ +│   └── pages/ +├── astro.config.mjs +├── README.md +├── package.json +└── tsconfig.json +``` + +Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. + +There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. + +Any static assets, like images, can be placed in the `public/` directory. + +## 🧞 Commands + +All commands are run from the root of the project, from a terminal: + +| Command | Action | +| :--------------------- | :----------------------------------------------- | +| `npm install` | Installs dependencies | +| `npm run dev` | Starts local dev server at `localhost:3000` | +| `npm run build` | Build your production site to `./dist/` | +| `npm run preview` | Preview your build locally, before deploying | +| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | +| `npm run astro --help` | Get help using the Astro CLI | + +## 👀 Want to learn more? + +Check out [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat). + +## Credit + +This theme is based off of the lovely [Bear Blog](https://github.com/HermanMartinus/bearblog/). diff --git a/astro.config.mjs b/astro.config.mjs new file mode 100644 index 0000000..3b2f75c --- /dev/null +++ b/astro.config.mjs @@ -0,0 +1,10 @@ +import { defineConfig } from 'astro/config'; +import mdx from '@astrojs/mdx'; + +import sitemap from '@astrojs/sitemap'; + +// https://astro.build/config +export default defineConfig({ + site: 'https://example.com', + integrations: [mdx(), sitemap()], +}); diff --git a/package.json b/package.json new file mode 100644 index 0000000..d3af8c7 --- /dev/null +++ b/package.json @@ -0,0 +1,19 @@ +{ + "name": "@example/blog", + "type": "module", + "version": "0.0.1", + "private": true, + "scripts": { + "dev": "astro dev", + "start": "astro dev", + "build": "astro build", + "preview": "astro preview", + "astro": "astro" + }, + "dependencies": { + "astro": "^1.5.3", + "@astrojs/mdx": "^0.11.5", + "@astrojs/rss": "^1.0.2", + "@astrojs/sitemap": "^1.0.0" + } +} diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..0f39062 --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + diff --git a/public/placeholder-about.jpg b/public/placeholder-about.jpg new file mode 100644 index 0000000..2f736d9 Binary files /dev/null and b/public/placeholder-about.jpg differ diff --git a/public/placeholder-hero.jpg b/public/placeholder-hero.jpg new file mode 100644 index 0000000..66c8649 Binary files /dev/null and b/public/placeholder-hero.jpg differ diff --git a/public/placeholder-social.jpg b/public/placeholder-social.jpg new file mode 100644 index 0000000..e8844fe Binary files /dev/null and b/public/placeholder-social.jpg differ diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro new file mode 100644 index 0000000..ce60a7e --- /dev/null +++ b/src/components/BaseHead.astro @@ -0,0 +1,38 @@ +--- +// Import the global.css file here so that it is included on +// all pages through the use of the component. +import '../styles/global.css'; + +export interface Props { + title: string; + description: string; + image?: string; +} + +const { title, description, image = '/placeholder-social.jpg' } = Astro.props; +--- + + + + + + + + +{title} + + + + + + + + + + + + + + + + diff --git a/src/components/Footer.astro b/src/components/Footer.astro new file mode 100644 index 0000000..08395a4 --- /dev/null +++ b/src/components/Footer.astro @@ -0,0 +1,13 @@ +--- +const today = new Date(); +--- + +
+ © {today.getFullYear()} YOUR NAME HERE. All rights reserved. +
+ diff --git a/src/components/Header.astro b/src/components/Header.astro new file mode 100644 index 0000000..75577e6 --- /dev/null +++ b/src/components/Header.astro @@ -0,0 +1,25 @@ +--- +import HeaderLink from './HeaderLink.astro'; +import { SITE_TITLE } from '../config'; +--- + +
+

+ {SITE_TITLE} +

+ +
+ diff --git a/src/components/HeaderLink.astro b/src/components/HeaderLink.astro new file mode 100644 index 0000000..d82155c --- /dev/null +++ b/src/components/HeaderLink.astro @@ -0,0 +1,20 @@ +--- +export interface Props extends astroHTML.JSX.AnchorHTMLAttributes {} + +const { href, class: className, ...props } = Astro.props; +const isActive = href === Astro.url.pathname.replace(/\/$/, ''); +--- + + + + + diff --git a/src/config.ts b/src/config.ts new file mode 100644 index 0000000..1d5dbf6 --- /dev/null +++ b/src/config.ts @@ -0,0 +1,5 @@ +// Place any global data in this file. +// You can import this data from anywhere in your site by using the `import` keyword. + +export const SITE_TITLE = 'My personal website.'; +export const SITE_DESCRIPTION = 'Welcome to my website!'; diff --git a/src/env.d.ts b/src/env.d.ts new file mode 100644 index 0000000..f964fe0 --- /dev/null +++ b/src/env.d.ts @@ -0,0 +1 @@ +/// diff --git a/src/layouts/BlogPost.astro b/src/layouts/BlogPost.astro new file mode 100644 index 0000000..67f2974 --- /dev/null +++ b/src/layouts/BlogPost.astro @@ -0,0 +1,54 @@ +--- +import BaseHead from '../components/BaseHead.astro'; +import Header from '../components/Header.astro'; +import Footer from '../components/Footer.astro'; + +export interface Props { + content: { + title: string; + description: string; + pubDate?: string; + updatedDate?: string; + heroImage?: string; + }; +} + +const { + content: { title, description, pubDate, updatedDate, heroImage }, +} = Astro.props; +--- + + + + + + + + +
+
+
+ {heroImage && } +

{title}

+ {pubDate && } + {updatedDate && ( +
+ Last updated on +
+ )} +
+ +
+
+