Course List App

Course List App

Context

I built this full stack app completely from top to bottom, while learning to use Express and React.

The assignment was to make a course directory app for a fictional educational institution that allowed authenticated users to create and edit course listings with descriptions.

This included building a custom REST API for back end data management, along with a React single page app as the front end.

Objective

The app features user authentication, CRUD functions (create, read, update, delete) for listing courses, and a home page features a list of all the courses that have been created for the fictional Skills Academy.

Process

I was provided with HTML mockups of the pages, base CSS styles, and data seed files as a starting point for this project. The rest of the project was coded by hand following a strict set of requirements, with customized styling and a few extra features added.

I built the REST API using Node & Express, and the client interface using React. In this case these tools were specifically required. This was actually the first full stack app that I have created, and it was the final project for my Techdegree program at Treehouse.

The most challenging part was understanding the quirky ways that React deals with fetched API data, and finding creative workarounds to meet the needs of the project – for example: placing variables inside of conditional clauses to circumvent empty variable errors occurring on page load.

Results

This project taught me how to build my own REST API and a to build a complete interface for user authentication and data management.

Skill Highlights

  • JavaScript
  • Node.js
  • React
  • Express
  • REST API
  • HTML & CSS