udacity-myreads's People
udacity-myreads's Issues
Same books displayed on all shelves
Same books displayed on all shelves
After Books component was added, the filter was never applied.
Hence, the same books were shown on all the shelves.
#2
Update the readme
Update the README to describe the project and include instructions for installing and launching the project.
Update React version
Update version of React to allow using hooks and other newer features
Add Book component
Add a single book component
Create a search page component
The search page has a search input field.
The search page behaves correctly:
a) As the user types into the search field, books that match the query are displayed on the page, along with their titles and authors. You can use throttle/debounce but are not required to do so.
b) Search results are not shown when all of the text is deleted out of the search input box.
c) Invalid queries are handled and prior search results are not shown.
d) The search works correctly when a book does not have a thumbnail or an author. (To test this, try searching for "poetry" and "biography"). (It's fine to filter out books with missing thumbnails.)
e) The user is able to search for multiple words, such as “artificial intelligence.”
Search results on the search page allow the user to select “currently reading”, “want to read”, or “read” to place the book in a certain shelf.
If a book is assigned to a shelf on the main page and that book appears on the search page, the correct shelf should be selected on the search page. If that book's shelf is changed on the search page, that change should be reflected on the main page as well. The option "None" should be selected if a book has not been assigned to a shelf.
Search - handle errors
The search page stops working when no results are found and an error message is displayed in the console.
Also, when search term existed but then erased, it still attempts to send an API request, which in turn results in another errored response.
Add ShelfChanger component
ShelfChanger component displays options of the shelves to move the book to.
On option change, executes the callback to perform the change.
Add routing between the main page and the search page
The main page contains a link to the search page. When the link is clicked, the search page is displayed and the URL in the browser’s address bar is /search.
The search page contains a link to the main page. When the link is clicked, the main page is displayed and the URL in the browser’s address bar is /.
Add books state
Add books state to a parent component.
An API call to get all the books sets the books' state after the component has rendered.
When the browser is refreshed, the same information is displayed on the page.
Create the main page (Books component)
The Books component shows 3 shelves for books (currently reading, want to read, and read). Each book is shown on the correct shelf, along with its title and all of its authors.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.