Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lyrklif/pet-projects-timeline
Pet Projects Timeline is a personal project to showcase and track the progress of various pet projects. The app presents a timeline of projects with their descriptions, repositories, and key details, allowing users to filter based on topics
https://github.com/lyrklif/pet-projects-timeline
frontend pet-project pet-projects portfolio portfolio-website svelte svelte-ts sveltekit timeline typescript
Last synced: 2 days ago
JSON representation
Pet Projects Timeline is a personal project to showcase and track the progress of various pet projects. The app presents a timeline of projects with their descriptions, repositories, and key details, allowing users to filter based on topics
- Host: GitHub
- URL: https://github.com/lyrklif/pet-projects-timeline
- Owner: Lyrklif
- Created: 2024-10-18T15:35:58.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2024-10-28T04:32:19.000Z (about 2 months ago)
- Last Synced: 2024-10-28T07:51:03.537Z (about 2 months ago)
- Topics: frontend, pet-project, pet-projects, portfolio, portfolio-website, svelte, svelte-ts, sveltekit, timeline, typescript
- Language: Svelte
- Homepage: https://lyrklif.github.io/pet-projects-timeline/
- Size: 1.19 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Pet Projects Timeline
**Pet Projects Timeline** is a web application that helps you track and showcase your pet projects over time. It displays a timeline of your personal projects, allowing you to filter and view details of each project. The app is built with SvelteKit and hosted on GitHub Pages.
![Project Screenshot](https://github.com/user-attachments/assets/6a5a3a67-828a-419c-9565-663ec4225545)
![Project Screenshot](https://github.com/user-attachments/assets/f3063f52-e58e-45b1-b5bd-0ece55092e24)## Features
- **Timeline of Projects:** View a chronological list of your pet projects.
- **Filters:** Filter projects by topic.
- **GitHub Integration:** Projects are fetched directly from GitHub repositories.
- **Responsive Design:** Works well on both desktop and mobile devices.
- **Static Hosting:** Deployed using GitHub Pages.## Demo
Check out the live demo: [Pet Projects Timeline](https://lyrklif.github.io/pet-projects-timeline/)
## Installation
To run the project locally, follow these steps:
1. Clone the repository:
```bash
git clone https://github.com/lyrklif/pet-projects-timeline.git
```2. Install dependencies:
```bash
npm install
```3. Create a `.env` file in the root directory based on the `.env.example` file:
```bash
cp .env.example .env
```Fill in the following values in the `.env` file:
```bash
VITE_USER_NAME=
VITE_GITHUB_LINK=
VITE_API=
VITE_EXCLUDED_REPOSITORIES=
```4. Run the development server:
```bash
npm run dev
```5. Open your browser and go to `http://localhost:5173`.
## Deployment
This project is set up for deployment to GitHub Pages using the `@sveltejs/adapter-static`. To deploy it, simply run:
```bash
npm run deploy
```Make sure that the base path is set correctly in the `svelte.config.js` file:
```js
paths: {
base: ''
}
```And `static/404.html`
```js
window.location.href = '//#' + pathname;
```## Tech Stack
- **Framework:** SvelteKit
- **Hosting:** GitHub Pages
- **CSS Framework:** Flowbite-Svelte
- **Data Fetching:** Svelte Query
- **Markdown Parsing:** Marked.js## Environment Variables
The project requires the following environment variables to be set in a `.env` file:
- `VITE_USER_NAME` - Your GitHub username.
- `VITE_GITHUB_LINK` - The link to your GitHub profile.
- `VITE_API` - The GitHub API URL, e.g., `https://api.github.com`.
- `VITE_EXCLUDED_REPOSITORIES` - A comma-separated string of repository names that should be excluded from the timeline (e.g., `repo1,repo2,repo3`).An example of these variables can be found in the `.env.example` file.
## Contributions
Contributions are welcome! If you have suggestions for improving the project or want to report an issue, feel free to open an issue or submit a pull request.