Code Monkey home page Code Monkey logo

quickflow's Introduction

Quickflow: A Better & Open-Source Alternative to Notion

Image of the app here

This repository is dedicated to Quickflow, an open-source alternative to Notion that aims to provide a superior user experience.

Technologies used to build

  • Next.js 13: A powerful React framework for building modern web applications.
  • Shadcn: Beautifully designed components that you can copy and paste into your apps.
  • Clerk: Clerk is a complete suite of embeddable UIs, flexible APIs, and admin dashboards to authenticate and manage your users.
  • Convex: Convex is a Backend Application Platform that keeps you focused on building your product. Convex Functions, Database, File Storage, Scheduling, and Search fit together cohesively
  • TailwindCSS: A utility-first CSS framework for streamlined web application styling.

Key Features

  • Real-time database ๐Ÿ”—
  • Notion-style editor ๐Ÿ“
  • Light and Dark mode ๐ŸŒ“
  • Infinite children documents ๐ŸŒฒ
  • Trash can & soft delete ๐Ÿ—‘๏ธ
  • Authentication ๐Ÿ”
  • File upload
  • File deletion
  • File replacement
  • Icons for each document (changes in real-time) ๐ŸŒ 
  • Expandable sidebar โžก๏ธ๐Ÿ”€โฌ…๏ธ
  • Full mobile responsiveness ๐Ÿ“ฑ
  • Publish your note to the web ๐ŸŒ
  • Fully collapsable sidebar โ†•๏ธ
  • Landing page ๐Ÿ›ฌ
  • Cover image of each document ๐Ÿ–ผ๏ธ
  • Recover deleted files ๐Ÿ”„๐Ÿ“„

Setting Up the Project in Local

Prerequisites

Ensure that you have Node version 18.x.x or a higher version installed.

Cloning the repository

git clone https://github.com/Nick-h4ck3r/quickflow.git

Install packages

npm i

Setup .env file

# Deployment used by `npx convex dev`
CONVEX_DEPLOYMENT=
NEXT_PUBLIC_CONVEX_URL=

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=

EDGE_STORE_ACCESS_KEY=
EDGE_STORE_SECRET_KEY=

Setup Convex

npx convex dev

Start the app

npm run dev

Credits

Special thanks to Antonio for his invaluable tutorial, which served as the foundation for building this app. You can find the tutorial here.

quickflow's People

Contributors

nick-h4ck3r avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.