https://github.com/spacedubby07/remix2
A website to showcase the husky breed.
https://github.com/spacedubby07/remix2
pexels-api remix tailwindcss typescript vite
Last synced: about 2 months ago
JSON representation
A website to showcase the husky breed.
- Host: GitHub
- URL: https://github.com/spacedubby07/remix2
- Owner: SpaceDubby07
- Created: 2024-09-10T02:44:00.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-21T20:18:57.000Z (over 1 year ago)
- Last Synced: 2025-01-29T18:16:29.252Z (over 1 year ago)
- Topics: pexels-api, remix, tailwindcss, typescript, vite
- Language: TypeScript
- Homepage: https://huskies.vercel.app
- Size: 171 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Husky Info Website
This project is a simple and elegant website designed to provide information about owning huskies. It features a clean and responsive design using modern web development tools and frameworks.
## Features
### 1. Home Page
- **Hero Section**: A visually engaging introduction with a captivating image and title.
- **Husky Ownership Info**: Key details on what to expect when owning a husky.
- **Traits Section**: Highlights notable traits of huskies.
- **Gallery Link**: Directs users to the gallery showcasing husky images.
### 2. History Page
- **Detailed History**: Provides background information about the husky breed.
### 3. Gallery Page
- **image loading**: Load more images as you go, click the button.
- **Captivating Photos**: A curated collection of husky images.
### 4. Contact Page
- **Planned Feature**: The contact page has not yet been implemented.
---
## Technologies Used
### Frontend
- **React**: Core framework for building user interfaces.
- **React DOM**: Handles DOM rendering for React.
- **React Icons**: Provides a library of reusable icons.
- **Recharts**: Utilized for any potential data visualization needs.
- **TailwindCSS**: CSS framework for styling.
- **DaisyUI**: Pre-built UI components for TailwindCSS.
### Backend
- **Remix**: Full-stack web framework for building the website.
- **Remix Dev Tools**: Development utilities for building and testing the app.
### Additional Libraries
- **Pexels**: API integration for fetching images.
- **Match Sorter**: Provides sorting utilities for any dynamic lists.
- **Sort By**: Simplifies object sorting.
- **Isbot**: Detects bots for enhanced user analytics.
- **Tiny Invariant**: Lightweight error-checking utility.
### Build Tools
- **Vite**: Modern build tool for faster development and builds.
- **ESLint**: Linter to maintain code quality and enforce coding standards.
- **TypeScript**: Adds static typing for enhanced developer experience.
- **PostCSS**: CSS post-processing tool for added flexibility.
---
## Installation
### Prerequisites
- Node.js >= 20.0.0
- npm or yarn
### Steps
1. Clone the repository:
```bash
git clone
```
2. Navigate to the project directory:
```bash
cd template
```
3. Install dependencies:
```bash
npm install
```
4. Start the development server:
```bash
npm run dev
```
5. Open your browser and navigate to `http://localhost:3000`.
---
## Scripts
- `npm run dev`: Starts the development server.
- `npm run build`: Builds the application for production.
- `npm run start`: Starts the production server.
- `npm run lint`: Runs ESLint to check for code quality.
- `npm run typecheck`: Checks for TypeScript errors.
---
## Future Improvements
- Implement the contact page with a form for user inquiries.
- Add more detailed information about husky traits and ownership tips.
- Include animations and transitions for a more interactive user experience.
---
## License
This project is open-source and available under the [MIT License](LICENSE).
---
## Acknowledgments
- **Pexels**: For providing the husky images.
- Open-source libraries and tools used in this project.