Skip to content

SpaceDubby07/remix2

Repository files navigation

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:
    git clone <repository-url>
  2. Navigate to the project directory:
    cd template
  3. Install dependencies:
    npm install
  4. Start the development server:
    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.


Acknowledgments

  • Pexels: For providing the husky images.
  • Open-source libraries and tools used in this project.

About

A website to showcase the husky breed.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors