Giter VIP home page Giter VIP logo

flare's Introduction

Logo

Flare - Social Network for Developers

The social networking developers have been longing for.

View Demo ยท Report Bug ยท Request Feature


Flare - Social Network for Developers

Flare is my take on a social network for developers. It's built entirely around the needs and interests of software developers. Flare is my entry for the Netlify x Hashnode Hackathon ๐Ÿ”ฅ

TL;DR: Flare is a new kind of social networking site made especially for software developers. Twitter is a really great place where developers hang out and share insightful tweets. But there is something that is lacking there.

Features โœจ

Here are some features that I planned for Flare. The ones implemented right now are marked. The fundamental idea is to support writing small posts within Flare. So the concept of blocks came. Blocks are used to create a flare, you can have text, code, images, etc in a single flare. Each of these smaller items that make up a flare is called a block.

  • Share Code snippets โœ…
  • Share terminal scripts โœ…
  • Share Images โœ…
  • Comments โœ…
  • Bookmarks โœ…
  • Show Spotify last played songs โœ…
  • Header Image promotions โœ…
  • Kudos โœ…
  • Connect Hashnode blog โœ…

Profile Page

Mobile View

Running Locally ๐Ÿ’ป

1. Clone the repo

git clone https://github.com/adisreyaj/flare.git

2. Initialize the submodule (UI components)

I created a small UI component library called Zigzag that is used in the project as a submodule.

git submodule update --init

3. Install the dependencies

npm install

4. Setup the environment variables

Set up all the required environment variables required for the back-end:

NODE_ENV=development
DATABASE_URL=mysql://root:root@localhost:3307/flare
FRONT_END_CALLBACK_URL=http://localhost:4200/auth/callback

# JWT sign secret
JWT_SECRET=veryverysecretkey
JWT_EXPIRY="3d"
COOKIE_SECRET=veryverysecretsessionkey

# Google OAuth Details
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GOOGLE_CALLBACK_URI=http://localhost:3333/api/auth/google/callback

# Github OAuth Details
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
GITHUB_CALLBACK_URI=http://localhost:3333/api/auth/github/callback

# Queue
REDIS_HOST=localhost
REDIS_PORT=6379
REDIS_PASSWORD=

# Object Storage
S3_ENDPOINT=
S3_REGION=
S3_BUCKET=
S3_ACCESS_KEY_ID=
S3_SECRET_ACCESS_KEY=

5. Prepare the Database

Use docker-compose to spin up MySQL and Redis databases.

version: '3.1'
services:
  db:
    image: mariadb
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: root
      MYSQL_DATABASE: flare
    ports:
      - '3307:3306'
    volumes:
      - /Users/<username>/Desktop/code/db:/var/lib/mysql
  cache:
    image: redis
    restart: always
    ports:
      - '6379:6379'
    volumes:
      - /Users/<username>/Desktop/code/cache:/var/lib/redis

6. Set up the Database

Run the command to populate the DB with tables:

npm run prisma:migrate

7. Generate the GraphQL interfaces from the schema

Run the command to generate the required types:

npm run generate:gql

8. Start up the UI and Back-end

For UI:

npm start

For Back-end

npm start api

UI: http://localhost:4200 & GQL: http://localhost:3333

You are all set for exploring Flare locally.

Links and References ๐Ÿ”—

Title Link Description
Angular https://angular.io/ Front-end framework
NestJs https://docs.nestjs.com/ Back-end framework based on NodeJs
Netlify https://www.netlify.com/ Deployment for UI
Prisma https://www.prisma.io/ Node.js and TypeScript ORM
Tailwind CSS https://tailwindcss.com/ Utility first CSS framework
Nx https://nx.dev/#getting-started Build system with monorepo support
PM2 https://app.pm2.io/ Advanced, production process manager for Node.JS
Upstash https://upstash.com/ Serverless Redis DB
Backblaze https://www.backblaze.com/ Cloud Storage

Roadmap

See the open issues for a list of proposed features (and known issues).

License

Distributed under the Apache 2.0 License. See LICENSE for more information.

Show your support

Please โญ๏ธ this repository if this project helped you!

flare's People

Contributors

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