Skip to content

Latest commit

 

History

History
136 lines (124 loc) · 4.5 KB

README.md

File metadata and controls

136 lines (124 loc) · 4.5 KB

gabsavard.com Redesign

This is the code for my personal website. I am using this opportunity to continue learning the Astrojs framework as well as the React and Tailwind. My goal is to not only design and build a complete website containing a projects, a blog and a contact form. I will take inspiration from my other Astrojs project for some of my components. Eventually, this website will be deployed through Netlify.

Table of Contents

Features

I know websites usually don't have a feature part, especially when they use frameworks like Astro that are more about being static. But I am using this section more as a checklist for what I want to do with my website:

  • Home Page
    • Replace the hero image
    • Salutation module
    • Resume
    • Landing
    • Latest posts
    • RSS Button
  • Projects
    • Projects index page
      • Automatically updates with new projects
    • Project Page Layout
  • Blog
    • Blog index page
      • Filter the blog articles by tags
      • Automatically updates with new articles
    • Blog article Layout
  • Contact Page
    • Email form
    • Socials list
  • About Page
  • RSS Setup
  • Make website responsive
    • Home page
    • Contact page
    • Projects page
      • project layouts
    • Blog Page
      • Blog article layouts
    • About

Project Structure

Here's an overview of the project structure:

Astro-website/
├── astro.config.mjs
├── LICENSE
├── node_modules/
│   └── (Too many modules to list here)
├── package.json
├── package-lock.json
├── public/
│   ├── computer.svg
│   ├── downloads/
│   │     ├── mysql-survival-guide.md
│   │     └── mysql-survival-guide.pdf
│   ├── gab_savard_resume.pdf
│   ├── hero.png
│   ├── music/
│   │     └── demo_ep/
│   │         ├── Ballade.wav
│   │         ├── 'Far West.wav'
│   │         ├── 'F E E L I N G S.mp3'
│   │         └── Running.wav
│   ├── pictures/
│   │     ├── posts/
│   │     │   └── folders of images for each article
│   │     └── projects/
│   │         └── folders of images for each project
│   └── rss/
│       └── pretty-feed-v3.xsl
├── README.md
├── src/
│   ├── components/
│   │   ├── Alert.jsx
│   │   ├── AudioPlayer.jsx
│   │   ├── BlogCard.jsx
│   │   ├── BlogList.jsx
│   │   ├── ContactForm.jsx
│   │   ├── Gallery.jsx
│   │   ├── HeroImage.jsx
│   │   ├── LanguageList.jsx
│   │   ├── LatestPost.jsx
│   │   ├── MobileGallery.jsx
│   │   ├── MobilePicture.jsx
│   │   ├── Navigation.jsx
│   │   ├── Pagination.jsx
│   │   ├── Picture.jsx
│   │   ├── ProjectCard.jsx
│   │   ├── Salutations.jsx
│   │   ├── ScrollView.jsx
│   │   ├── SideBar.jsx
│   │   ├── SkillsTable.jsx
│   │   ├── SocialButton.astro
│   │   └── TagButton.jsx
│   ├── content/
│   │   ├── config.ts
│   │   ├── posts/
│   │   │   └── (All blog posts)
│   │   └── projects/
│   │       └── (All projects posts)
│   ├── layouts/
│   │   └── BaseLayout.astro
│   ├── pages/
│   │   ├── about.astro
│   │   ├── blog.astro
│   │   ├── contact.astro
│   │   ├── index.astro
│   │   ├── posts/
│   │   │   └── '[...slug].astro'
│   │   ├── projects/
│   │   │   └── '[...slug].astro'
│   │   ├── projects.astro
│   │   └── rss.xml.js
│   ├── styles/
│   │   └── global.css
│   └── env.d.ts
├── tailwind.config.mjs
└── tsconfig.json
  • public/: Static assets like images and icons.
  • src/components/: Reusable components used throughout the site.
  • src/layouts/: Layout components to structure different pages.
  • src/pages/: Page components for different routes.
  • src/styles/: Global style used when tailwind cannot be used.
  • src/contents/: The collections of content stored on the website.

License

This project is licensed under the MIT License. See the LICENSE file for more details.