/shadcn-timeline

Customizable and re-usable timeline component for you to use in your projects. Built on top of shadcn.

Primary LanguageTypeScript

shadcn-timeline

Customizable and re-usable timeline component for you to use in your projects.

Built on top of shadcn.

Preview Usage Installation Tech Stack

Preview

shadcn_timeline_laptop

Usage

You can use the source code and copy paste components into your NextJS projects. These components in particular:

/src/app/components/timeline/timeline-layout.tsx & timeline.tsx

Installation

If you'd like to spin up a local environment similar to the demo, follow these instructions:

  1. Clone the repository to a directory on your pc via command prompt:
     git clone https://github.com/timDeHof/shadcn-timeline.git
  2. Open the folder:
    cd shadcn-timeline
  3. Install dependencies:
    npm install
  4. Start the development server:
    npm run dev
  5. Go to localhost and start playing around!

Tech stack

NextJS - React Framework for the web

TailwindCSS - Utility-first CSS framework

shadcn-ui - UI component built using Radix UI and Tailwind CSS