Giter Club home page Giter Club logo

ujen5173 / readwonders Goto Github PK

View Code? Open in Web Editor NEW
1.0 2.0 0.0 5.54 MB

Introducing ReadWonders: An open-source full-stack application alternative to Wattpad. Built with Next.js 14, Tailwind CSS, t3-stack, Supabase, Prisma. ๐Ÿš€

Home Page: https://readwonders.vercel.app

JavaScript 1.09% TypeScript 92.96% CSS 1.60% PLpgSQL 0.28% MDX 4.08%
nextjs postgresql prisma stories story-telling supabase tailwindcss trpc open-source prisma-orm

readwonders's Introduction

ReadWonders

Welcome to ReadWonders, a robust community platform designed for creators to compose and share their narratives, articulate their emotions, and engage with a supportive audience. Whether you are an experienced writer or a novice, ReadWonders offers a versatile environment to unleash your creativity and refine your voice.

Warning This is a work-in-progress and not the finished product.

ReadWonders is in its very early days of development. We are working hard to provide an initial version as soon as possible and are accepting contributions.

Feel free to leave feature suggestions but please don't open issues for bugs or support requests just yet.

Follow me on GitHub @ujen5173 for updates.

image

Table of Contents

Tech Stack

  • Next.js
  • Tailwind CSS
  • Prisma
  • Supabase
  • TRPC
  • Posthog
  • Uploadthing

Features

  • Offline Support
  • Collaborative Writing
  • Discussion Threads
  • Achievements
  • Live Writing Sessions
  • Write Stories with AI Writing Assistant
  • Like, Comment on Stories, Follow Creators, Notifications
  • Personalized Feed
  • Premium Subscription for Exclusive Content
  • Schedule Stories

Getting Started

Prerequisites

Make sure you have the following installed on your system:

  • Node.js
  • pnpm
  • Supabase

Installation

  1. Clone the repository:
  git clone https://github.com/your-username/ReadWonders.git
  1. Navigate to the project directory:
  cd ReadWonders
  1. Install dependencies:
  pnpm install
  1. Set up environment variables:

Create a .env file in the root directory and add the environment variables referenced in the .env.example file.

Supabase Setup

  1. Create an account on Supabase.
  2. Populate the API keys in the .env file as referenced in .env.example.
  3. Push the Prisma schema to Supabase:
  pnpm db:push
  1. Enable the RLS policy in all tables for security.
  2. Set up Supabase auth:
  • Navigate to the SQL editor to set up the authentication process.
  • Run the following SQL queries in the Supabase SQL editor one by one:
  CREATE OR REPLACE FUNCTION public.handle_new_user()
  RETURNS TRIGGER AS $$
  DECLARE
      username_suffix TEXT;
  BEGIN
      -- Generate a random number between 0 and 9999
      SELECT to_char(floor(random() * 10000)::int, 'FM0000') INTO username_suffix;

      -- Inserting into the profiles table
      INSERT INTO public.profiles (id, name, email, profile, username)
      VALUES (NEW.id,
              NEW.raw_user_meta_data ->> 'full_name',
              NEW.email,
              NEW.raw_user_meta_data ->> 'picture',
              lower(regexp_replace(NEW.raw_user_meta_data ->> 'full_name', '\s+', '', 'g')) || username_suffix);

      RETURN NEW;
  END;
  $$ LANGUAGE plpgsql SECURITY DEFINER;

  CREATE OR REPLACE TRIGGER on_auth_user_created
  AFTER INSERT ON auth.users
  FOR EACH ROW EXECUTE FUNCTION public.handle_new_user();

  CREATE OR REPLACE FUNCTION public.handle_user_delete()
  RETURNS TRIGGER AS $$
  BEGIN
    DELETE FROM auth.users WHERE id = old.id;
    RETURN old;
  END;
  $$ LANGUAGE plpgsql SECURITY DEFINER;

  CREATE OR REPLACE TRIGGER on_profile_user_deleted
  AFTER DELETE ON public.profiles -- replace `profiles` with your profile table name
  FOR EACH ROW EXECUTE FUNCTION public.handle_user_delete();
  1. Adding Google signup:

Navigate to /auth/providers in Supabase, enable Google, and paste the API keys.

Running the Project

Start the development server:

  pnpm dev

The application will be available at http://localhost:3000.

Contributing

We welcome contributions from the community. Please follow these steps to contribute:

  1. Fork the repository.

  2. Create a new branch:

  git checkout -b feature-branch
  1. Commit your changes:
  git commit -m 'Add some feature'
  1. Push to the branch:
  git push origin feature-branch
  1. Open a pull request.

Please make sure your code adheres to our coding standards.

Thank you for contributing to ReadWonders! Together, we can build a platform where every story matters and every voice is heard.

readwonders's People

Contributors

ujen5173 avatar

Stargazers

 avatar

Watchers

 avatar  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.