Skip to content

Latest commit

 

History

History
41 lines (29 loc) · 2.34 KB

README.md

File metadata and controls

41 lines (29 loc) · 2.34 KB

React + Redux Conduit App

Getting started

Install nodejs if you don't already have it.

To get the frontend running locally:

  • npm install to install all req'd dependencies
  • npm start to start the local server (this project uses create-react-app)

Local web server will use port 4100 instead of standard React's port 3000 to prevent conflicts with some backends like Node or Rails. You can configure port in scripts section of package.json: we use cross-env to set environment variable PORT for React scripts, this is Windows-compatible way of setting environment variables.

Alternatively, you can add .env.development file in the root folder of project to set environment variables (use PORT to change webserver's port). This file will be ignored by git, so it is suitable for API keys and other sensitive stuff. Refer to dotenv and React documentation for more details. Also, please remove setting variable via script section of package.json - dotenv never override variables if they are already set.

Making requests to the backend API

If you want to change the API URL to a local server, simply edit .env.development and change REACT_APP_API_ROOT to the local server's URL (i.e. http://localhost:8080)

Functionality overview

The general page breakdown looks like this:

  • Home page (URL: /#/ )
    • List of tags
    • List of articles pulled from either Feed, Global, or by Tag
    • Pagination for list of articles
  • Sign in/Sign up pages (URL: /#/login, /#/register )
    • Use JWT (store the token in localStorage)
  • Settings page (URL: /#/settings )
  • Editor page to create/edit articles (URL: /#/editor, /#/editor/article-slug-here )
  • Article page (URL: /#/article/article-slug-here )
    • Delete article button (only shown to article's author)
    • Render markdown from server client side
    • Comments section at bottom of page
    • Delete comment button (only shown to comment's author)
  • Profile page (URL: /#/@username, /#/@username/favorites )
    • Show basic user info
    • List of articles populated from author's created articles or author's favorited articles