mlh-fellowship / owlhub

Owlhub

Space where coders come together

Introduction

You once wrote some terrible horrific code or some genius hacky function. Maybe you came across and interesting code snippet and you want to share that with world? Welcome to Owlhub where you can share code snippets with people from around the world.

🎯 Features

• Post code snippets
• View private posts by unlocking via a key
• View your profile
• React and comment to posts

📖 Documentation Details

The react project is bootstrapped with create-next-app. One the backend we are using amplify infrastructure

⚡ Installation

Install Dependencies

cd owlhub
npm install

Configure Amplify

Setup Amplify

Install amplify cli

npm install -g @aws-amplify/cli

Configure amplify

amplify configure

When you come to this section enter then access key ID and the secret access key which we will provide to you

Enter the access key of the newly created user:
? accessKeyId:  # YOUR_ACCESS_KEY_ID
? secretAccessKey:  # YOUR_SECRET_ACCESS_KEY
This would update/create the AWS Profile in your local machine
? Profile Name:  # (default)

Pull amplify back-end

amplify pull

Run Development Server

npm run dev

Learn More

To learn more about React, take a look at the following resources:

• React - React official docs
• Amplify - Amplify official docs
• React + Amplify Tutorial - Getting started with React and Amplify

👨‍💻 Contributors

Fatima Zahra Chriha

Sarah Fluck

Alesana Lealofi Eteuati Jr

owlhub's Issues

Authentication

Currently our code is using built-in authentication UI from amplify. Since we will be using chakra UI we should configure this manually using the auth api.

Refactor

Further refactor code in components and split logic in to helpers and services

Build basic ui with chakra

Set up chakra UI on the react application and build basic barebones prototype

Reactions and Comments

Add reaction and comments to the code, add a heart (maybe an owl) to like a post

Set up shared environment

We need to share a single environment for amplify to help streamline our development process. Rene was kind enough to point me this documentation and then based on those instructions add it to the README.

Also need to get to work on a README

Post

Authenticated user should be able to make a post through a code or rich text editor.

User profile

User can view their profile and all the posts they have made

When a new user makes a post, it should be the top post

Right now, it gets pushed to the bottom of the page

Feed

Get a scrolling feed for all the posts in the application. The posts should be hidden by default then given when entering the secret key you get to view it.

Allow new lines in the input field

Currently can't post code when there are multiple lines involved, which can make it more readable, i.e

for count, x in enumerate(values):print(count)

should be

for count, x in enumerate(values):
print(count)