Afternoon Roast

Video Demo

A Morning Brew-inspired simple content management system that allows writers to create stories, attach stories to a particular newsletter, and ultimately "publish" the newsletter to an API.

Link to Backend API

Table of Contents

• Getting Started
• Features
• Tech Stack
• Tools

Getting Started

1. Install Rails Backend API
2. Install Node.js and npm $ brew install node
3. Clone this repo and cd into the directory
4. Install all dependencies $ npm install
5. Obtain TinyMCE API Key and include in .env.local in the following format: REACT_APP_TINY_MCE_KEY=<YOUR KEY HERE>
6. Make sure the Rails server is running and then run the app $ npm start

Features

Stories and Newsletters

• View an index of all stories and newsletter issues, organized by date

• View, create, preview, submit, edit, and delete a story using TinyMCE editor (persisted to Lyra API)

• Build a newsletter issue

• Preview and submit the newsletter with stories submitted within the issue date (persisted to Lyra API)

• Delete a newsletter issue (which undoes publishing to API and un-associates stories with newsletter issue)

Tech Stack

• React.js
• Ruby on Rails API (Backend: https://github.com/vuonga1103/afternoon-roast-backend)
• PostgreSQL
• HTML/CSS
• Material UI
• Active Record

Tools

• Rack CORS
• ActiveModel::Serializer
• React Router
• Axios
• TinyMCE
• Sanitize HTML
• HTML React Parser