Build a Book Read App using React, part of Udacity Course "Front-End Web Developer Nanodegree Program":
In the MyReads project, you'll create a bookshelf app that allows you to select and categorize books you have read, are currently reading, or want to read. The project emphasizes using React to build the application and provides an API server and client library that you will use to persist information as you interact with the application.
Udacity provided a starter code for this project:
- All the CSS and HTML markup that may be used but omits the React code that is required to complete the project
- The provided code will demonstrate a static HTML page of the finished application, but with no interactive functionality
To get started please follow the instructions bellow:
- git clone https://github.com/KWagner91/myReads
- cd myreads
Install dependencies and run with:
npm
npm install npm start
or
yarn
yarn install yarn start
What the starter code provided:
├── CONTRIBUTING.md
├── README.md - This file.
├── SEARCH_TERMS.md # The whitelisted short collection of available search terms for you to use with your app.
├── package.json # npm package manager file. It's unlikely that you'll need to modify this.
├── public
│ ├── favicon.ico # React Icon, You may change if you wish.
│ └── index.html # DO NOT MODIFY
└── src
├── App.css # Styles for your app. Feel free to customize this as you desire.
├── App.js # This is the root of your app. Contains static HTML right now.
├── App.test.js # Used for testing. Provided with Create React App. Testing is encouraged, but not required.
├── BooksAPI.js # A JavaScript API for the provided Udacity backend. Instructions for the methods are below.
├── icons # Helpful images for your app. Use at your discretion.
│ ├── add.svg
│ ├── arrow-back.svg
│ └── arrow-drop-down.svg
├── index.css # Global styles. You probably won't need to change anything here.
└── index.js # You should not need to modify this file. It is used for DOM rendering only.- Using React to make a functional book track app. The user can move books between shelves and the same information is displayed after browser refresh.
- A search box lets user search for specific books and keywords using JavaScript
- Routing changes the URL of the search page and main page