andyscott-dot-me/README.md

# Astro Modern Personal Website

![Astro Modern Personal Website](public/social_img.png)

Modern Personal Website Template with Project Section, CV Section, Paginated Blog, RSS Feed, SEO Friendly, Visual themes and Responsive Desing for Astro framework.

## Demo

View a live demo of the [Astro Modern Personal Website](https://astro-modern-personal-website.netlify.app/)


## Installation

Run the following command in your terminal

``` bash
npm install
```

Once the packages are installed you are ready to run astro. Astro comes with a built-in development server that has everything you need for project development. The astro dev command will start the local development server so that you can see your new website in action for the very first time.

``` bash
npm run dev
```

## Tech Stack

- [Astro](astro.build)
- [tailwindcss](https://tailwindcss.com/)
- [DaisyUI](https://daisyui.com/)


## Project Strucutre

``` php
├── src/ 
│   ├── components/
│   │   ├── cs/
│   │   │   ├── TimeLine 
│   │   ├── BaseHead.astro
│   │   ├── Card.astro 
│   │   ├── Footer.astro 
│   │   ├── Header.astro 
│   │   └── HorizontalCard.jsx
│   │   └── SideBar.jsx
│   ├── layouts/
│   │   └── BaseLayout.astro
│   │   └── PostLayout.astro
│   └── pages/
│   │   ├── blog/
│   │   │   ├── [page].astro
│   │   │   ├── post1.md
│   │   │   ├── post2.md
│   │   │   └── post3.md
│   │   └── cv.astro
│   │   └── index.astro
│   │   └── projects.astro
│   │   └── rss.xml.js
│   └── styles/
│       └── global.css
├── public/
│   ├── favicon.svg
│   └── social-image.png
│   └── sprofile.jpg
│   └── social_img.webp
├── astro.config.mjs
├── tailwind.config.cjs
├── package.json
└── tsconfig.json
```

## Components usage

### Layout Components

The `BaseHead`, `Footer`, `Header` and `SideBar` components are already included in the layout sistem. To change the website content you can edit the content of this componenets.

#### SideBar

In the Sidebar you can change the links to all your website pages. 

You can change your avatar shape using [mask classes](https://daisyui.com/components/mask/).

The used social-icons are SVG form [BoxIcons](https://boxicons.com/) pack.

### TimeLine

The timeline components are used to conform the CV.

``` html
 <div class="time-line-container">
    <TimeLineElement
      title="Element Title"
      subtitle="Subtitle"
      desc="Description"
    />
    ...
</div>
```

### Card & HorizontalCard
``` html
   <HorizontalCard
      title="Card Title"
      img="imge_url""
      desc="Description"
      url="Link URL"
      target="Optional link target (_blank default)"
      badge="Optional badge"
      tags={['Array','of','tags']}
    />
```

### Layouts

Include `BaseLayout` in each page you add and `PostLayout` to your post pages.

## Pages

### Blog

Add your `md` blog post in the `/pages/blog/` folder.

### [page].astro

The `[page].astro` is the route to work with the paginated post list. You can change there the number of items listed for each page and the pagination button labels.

#### Post format
Add code with this format in the top of each post file.
```
---
layout: "../../layouts/PostLayout.astro"
title: "Post Title"
description: "Description"
pubDate: "Post date format(Sep 10 2022)"
heroImage: "Post Hero Image URL"
---
```
### Static pages

The other pages inlcuded in the template are static pages. The `index` page belong to the root page. You can add your pages directly in the `/pages` folder and then add a link to that pages in the `sidebar` component.

Feel free to modify the content included in the pages that the template contains or add the ones you need.

## Theming

For change the template theme change the `data-theme` atribute of the `<html>` tag in `BaseLayout.astro` file. 

You can chose among 30 themes available or create your custom theme. See themes available [here](https://daisyui.com/docs/themes/).

## Deploy

You can deploy your site on your favorite static hosting service such as Vercel, Netlify, GitHub Pages, etc.

The configuration for the deployment varies depending on the platform where you are going to do it. See the [official Astro information](https://docs.astro.build/en/guides/deploy/) to deploy your website.

> **⚠️ CAUTION** </br>
> The Blog pagination of this template is implemented using dynamic route parameters in its filename and for now this format is incompatible with SSR deploy configs, so please use the default static deploy options for your deployments.

## Contributing

Suggestions and pull requests are welcomed! Feel free to open a discussion, an issue or create a pull request.

## License

Astro Modern Personal Website is licensed under the MIT license — see the [LICENSE](https://github.com/manuelernestog/astro-modern-personal-website/blob/main/LICENSE) file for details.
updating readme file 2022-10-01 10:06:36 -04:00			`# Astro Modern Personal Website`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
Adding img to readme 2022-10-02 13:49:01 -04:00			`![Astro Modern Personal Website](public/social_img.png)`

updating readme file 2022-10-01 10:06:36 -04:00			`Modern Personal Website Template with Project Section, CV Section, Paginated Blog, RSS Feed, SEO Friendly, Visual themes and Responsive Desing for Astro framework.`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
improving usability and readme 2022-10-03 09:10:39 -04:00			`## Demo`

			`View a live demo of the [Astro Modern Personal Website](https://astro-modern-personal-website.netlify.app/)`


updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`## Installation`

			`Run the following command in your terminal`

			``` bash
			`npm install`
			```

			`Once the packages are installed you are ready to run astro. Astro comes with a built-in development server that has everything you need for project development. The astro dev command will start the local development server so that you can see your new website in action for the very first time.`

			``` bash
			`npm run dev`
			```

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`## Tech Stack`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			`- [Astro](astro.build)`
			`- [tailwindcss](https://tailwindcss.com/)`
			`- [DaisyUI](https://daisyui.com/)`


changing files to baseLayout 2022-09-26 15:49:05 -04:00
			`## Project Strucutre`

			``` php
			`├── src/`
			`│ ├── components/`
			`│ │ ├── cs/`
			`│ │ │ ├── TimeLine`
			`│ │ ├── BaseHead.astro`
			`│ │ ├── Card.astro`
			`│ │ ├── Footer.astro`
			`│ │ ├── Header.astro`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ │ └── HorizontalCard.jsx`
			`│ │ └── SideBar.jsx`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`│ ├── layouts/`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ │ └── BaseLayout.astro`
			`│ │ └── PostLayout.astro`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`│ └── pages/`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ │ ├── blog/`
			`│ │ │ ├── [page].astro`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`│ │ │ ├── post1.md`
			`│ │ │ ├── post2.md`
			`│ │ │ └── post3.md`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ │ └── cv.astro`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`│ │ └── index.astro`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ │ └── projects.astro`
			`│ │ └── rss.xml.js`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`│ └── styles/`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ └── global.css`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`├── public/`
			`│ ├── favicon.svg`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`│ └── social-image.png`
			`│ └── sprofile.jpg`
			`│ └── social_img.webp`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`├── astro.config.mjs`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`├── tailwind.config.cjs`
changing files to baseLayout 2022-09-26 15:49:05 -04:00			`├── package.json`
			`└── tsconfig.json`
			```
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`## Components usage`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### Layout Components`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			The `BaseHead`, `Footer`, `Header` and `SideBar` components are already included in the layout sistem. To change the website content you can edit the content of this componenets.
updating readme, footer and avatar img 2022-10-01 09:07:02 -04:00
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`#### SideBar`
updating readme, footer and avatar img 2022-10-01 09:07:02 -04:00
			`In the Sidebar you can change the links to all your website pages.`

			`You can change your avatar shape using [mask classes](https://daisyui.com/components/mask/).`

			`The used social-icons are SVG form [BoxIcons](https://boxicons.com/) pack.`

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### TimeLine`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			`The timeline components are used to conform the CV.`

			``` html
			`<div class="time-line-container">`
			`<TimeLineElement`
			`title="Element Title"`
			`subtitle="Subtitle"`
			`desc="Description"`
			`/>`
			`...`
			`</div>`
			```

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### Card & HorizontalCard`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			``` html
			`<HorizontalCard`
			`title="Card Title"`
			`img="imge_url""`
			`desc="Description"`
			`url="Link URL"`
			`target="Optional link target (_blank default)"`
			`badge="Optional badge"`
			`tags={['Array','of','tags']}`
			`/>`
			```

			`### Layouts`

			Include `BaseLayout` in each page you add and `PostLayout` to your post pages.

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`## Pages`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### Blog`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			Add your `md` blog post in the `/pages/blog/` folder.

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### [page].astro`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			The `[page].astro` is the route to work with the paginated post list. You can change there the number of items listed for each page and the pagination button labels.

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`#### Post format`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00			`Add code with this format in the top of each post file.`
			```
			`---`
			`layout: "../../layouts/PostLayout.astro"`
			`title: "Post Title"`
			`description: "Description"`
			`pubDate: "Post date format(Sep 10 2022)"`
			`heroImage: "Post Hero Image URL"`
			`---`
			```
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`### Static pages`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			The other pages inlcuded in the template are static pages. The `index` page belong to the root page. You can add your pages directly in the `/pages` folder and then add a link to that pages in the `sidebar` component.

			`Feel free to modify the content included in the pages that the template contains or add the ones you need.`

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`## Theming`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			For change the template theme change the `data-theme` atribute of the `<html>` tag in `BaseLayout.astro` file.

			`You can chose among 30 themes available or create your custom theme. See themes available [here](https://daisyui.com/docs/themes/).`

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`## Deploy`

			`You can deploy your site on your favorite static hosting service such as Vercel, Netlify, GitHub Pages, etc.`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00
			`The configuration for the deployment varies depending on the platform where you are going to do it. See the [official Astro information](https://docs.astro.build/en/guides/deploy/) to deploy your website.`

Updating readme file for deploy details 2022-10-04 23:42:20 -04:00			`> ⚠️ CAUTION </br>`
Update README.md 2022-10-05 01:46:53 -04:00			`> The Blog pagination of this template is implemented using dynamic route parameters in its filename and for now this format is incompatible with SSR deploy configs, so please use the default static deploy options for your deployments.`
Updating readme file for deploy details 2022-10-04 23:42:20 -04:00
			`## Contributing`

			`Suggestions and pull requests are welcomed! Feel free to open a discussion, an issue or create a pull request.`

			`## License`

			`Astro Modern Personal Website is licensed under the MIT license — see the [LICENSE](https://github.com/manuelernestog/astro-modern-personal-website/blob/main/LICENSE) file for details.`
updating readme file and some other stufs 2022-09-27 11:44:13 -04:00