https://github.com/joao208/square

Just a project to learn more of tailwind, liveblocks.io and react flow. Using nextjs and some tech, the code is not the best but can work.
https://github.com/joao208/square

dark-theme nextjs tailwindcss

Last synced: 14 days ago
JSON representation

Just a project to learn more of tailwind, liveblocks.io and react flow. Using nextjs and some tech, the code is not the best but can work.

• Host: GitHub
• URL: https://github.com/joao208/square
• Owner: Joao208
• Created: 2023-01-29T18:06:58.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-01-29T18:34:24.000Z (almost 2 years ago)
• Last Synced: 2024-12-07T14:33:55.160Z (18 days ago)
• Topics: dark-theme, nextjs, tailwindcss
• Language: TypeScript
• Homepage: https://square-blond.vercel.app
• Size: 187 KB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  



# Square - Tailwind, liveblocks.io & React Flow Learning Project

This project, named "Square", is aimed at exploring the use of Tailwind CSS, liveblocks.io, and React Flow in a Next.js environment. The code quality is not the best, but it is functional.

## Tech Stack

- Next.js

- Tailwind CSS

- liveblocks.io

- React Flow

## Demo

Demo link: https://square-blond.vercel.app/

## Getting Started

You need the liveblocks token.

Access https://liveblocks.io/, log in, select the project development and go to API Keys, then, copy the Public API Key.

Now you can past at the `.env`

```.env

NEXT_PUBLIC_LIVE_BLOCKS_PUBLIC_KEY=

```

To run the project locally, clone the repository and install the dependencies with:

```bash

npm install

```

Then run the following command to generate the Tailwind CSS:

```bash

npm run tailwind:generate

```

Finally, start the development server with:

```bash

npm run dev

```

The app will be running on http://localhost:3000.

## Contributing

Feel free to contribute to the project by submitting pull requests or reporting issues. Let's learn and grow together!

## Deploy