- {this.state.showSearchPage ? (
-
-
-
this.setState({ showSearchPage: false })}>Close
-
- {/*
- NOTES: The search from BooksAPI is limited to a particular set of search terms.
- You can find these search terms here:
- https://github.com/udacity/reactnd-project-myreads-starter/blob/master/SEARCH_TERMS.md
- However, remember that the BooksAPI.search method DOES search by title or author. So, don't worry if
- you don't find a specific author or title. Every search is limited by search terms.
- */}
-
+
+
+
+ (
+ (
+
-
-
-
- ) : (
-
-
-
MyReads
-
-
-
-
-
Currently Reading
-
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
To Kill a Mockingbird
-
Harper Lee
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Ender's Game
-
Orson Scott Card
-
-
-
-
-
-
Want to Read
-
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
1776
-
David McCullough
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Harry Potter and the Sorcerer's Stone
-
J.K. Rowling
-
-
-
-
-
-
Read
-
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
The Hobbit
-
J.R.R. Tolkien
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Oh, the Places You'll Go!
-
Seuss
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
The Adventures of Tom Sawyer
-
Mark Twain
-
-
-
-
-
-
-
- this.setState({ showSearchPage: true })}>Add a book
-
-
- )}
+
+
- )
+ );
}
}
diff --git a/src/Main.js b/src/Main.js
new file mode 100644
index 0000000000..34623682a0
--- /dev/null
+++ b/src/Main.js
@@ -0,0 +1,181 @@
+import React from 'react'
+import './App.css'
+import {Link} from 'react-router-dom'
+
+class Main extends React.Component
+{
+ render()
+ {
+ return (
+
+
+
+
+
+
MyReads
+
+
+
+
+
Currently Reading
+
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
To Kill a Mockingbird
+
Harper Lee
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
Ender's Game
+
Orson Scott Card
+
+
+
+
+
+
Want to Read
+
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
1776
+
David McCullough
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
Harry Potter and the Sorcerer's Stone
+
J.K. Rowling
+
+
+
+
+
+
Read
+
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
The Hobbit
+
J.R.R. Tolkien
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
Oh, the Places You'll Go!
+
Seuss
+
+
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
The Adventures of Tom Sawyer
+
Mark Twain
+
+
+
+
+
+
+
+ Add a book
+
+
+
+
+ )}
+
+
);
+ }
+}
+
+export default Main
\ No newline at end of file
diff --git a/src/Search.js b/src/Search.js
new file mode 100644
index 0000000000..ecb8d3b9c1
--- /dev/null
+++ b/src/Search.js
@@ -0,0 +1,33 @@
+import React from 'react'
+import './App.css'
+import {Link} from 'react-router-dom'
+
+class Search extends React.Component
+{
+ render()
+ {
+ return (
+
+ );
+ }
+}
+
+export default Search;
\ No newline at end of file
From 4063b9b914f8a3ee492c152a9e403b1bc3d4a5c0 Mon Sep 17 00:00:00 2001
From: Sudhir Kumar <2017ucp1296@mnit.ac.in>
Date: Thu, 4 Jun 2020 01:50:17 +0530
Subject: [PATCH 3/7] updated main page
---
src/App.js | 30 ++++++-
src/Main.js | 228 +++++++++++++++++++++++-----------------------------
2 files changed, 127 insertions(+), 131 deletions(-)
diff --git a/src/App.js b/src/App.js
index 6d0d51ce38..9cfb76a924 100644
--- a/src/App.js
+++ b/src/App.js
@@ -6,16 +6,42 @@ import Search from './Search'
import {BrowserRouter as Router , Route} from 'react-router-dom'
class BooksApp extends React.Component {
-
+
+ state = {
+ books : []
+ }
+
+ async componentDidMount()
+ {
+ this.updatebook();
+ }
+
+ async updatebook()
+ {
+ const fetchapi = BooksAPI.getAll();
+ fetchapi.then((data) =>
+ {
+ console.log(data);
+ this.setState({books : data});
+ });
+ }
+
+
+
render() {
+
+ if(this.state.books.length === 0)
+ {
+ return
loading ....
+ }
return (
(
-
)}/>
(
@@ -20,151 +37,104 @@ class Main extends React.Component
Currently Reading
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
To Kill a Mockingbird
-
Harper Lee
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Ender's Game
-
Orson Scott Card
-
+ {
+ contreading.map((book ) =>
+ {
+
+ return
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
{book.title}
+
{book.authors}
+
+
+ })}
+
+
+
Want to Read
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
1776
-
David McCullough
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Harry Potter and the Sorcerer's Stone
-
J.K. Rowling
-
+ {
+ wanttoread.map((book ) =>
+ {
+
+ return
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
{book.title}
+
{book.authors}
+
+
+ })}
+
+
Read
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
The Hobbit
-
J.R.R. Tolkien
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
Oh, the Places You'll Go!
-
Seuss
-
-
-
-
-
-
-
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
The Adventures of Tom Sawyer
-
Mark Twain
-
+ {
+ read.map((book ) =>
+ {
+
+ return
+
+
+
+
+
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
{book.title}
+
{book.authors}
+
+
+ })}
+
+
+
-
Add a book
@@ -178,4 +148,4 @@ class Main extends React.Component
}
}
-export default Main
\ No newline at end of file
+export default Main;
\ No newline at end of file
From 07ed09e47fdc349b89c719737cf961ab75953fea Mon Sep 17 00:00:00 2001
From: Sudhir Kumar <2017ucp1296@mnit.ac.in>
Date: Thu, 4 Jun 2020 05:24:39 +0530
Subject: [PATCH 4/7] work done
---
src/App.css | 7 +++
src/App.js | 25 +++++++++--
src/BooksAPI.js | 2 +-
src/Main.js | 24 +++++++---
src/Search.js | 114 ++++++++++++++++++++++++++++++++++++++++--------
5 files changed, 144 insertions(+), 28 deletions(-)
diff --git a/src/App.css b/src/App.css
index 28960adf8f..c81d0c3afe 100644
--- a/src/App.css
+++ b/src/App.css
@@ -184,6 +184,8 @@ button:active {
cursor: pointer;
}
+
+
/* book cover */
.book-cover {
@@ -196,3 +198,8 @@ button:active {
text-align: center;
font-size: 0.8em;
}
+
+
+.select-selected {
+ background-color: DodgerBlue;
+}
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 9cfb76a924..2ca0a4e503 100644
--- a/src/App.js
+++ b/src/App.js
@@ -16,17 +16,34 @@ class BooksApp extends React.Component {
this.updatebook();
}
- async updatebook()
+
+
+ async updatebook(e)
{
const fetchapi = BooksAPI.getAll();
fetchapi.then((data) =>
{
- console.log(data);
+
this.setState({books : data});
});
}
+ updatebookshelf = async (id,shelf) =>
+ {
+ console.log(id);
+ console.log(shelf);
+
+ BooksAPI.update(id,shelf).then((data) =>
+ {
+
+ this.updatebook();
+ }
+ )
+ }
+
+
+
render() {
@@ -41,10 +58,10 @@ class BooksApp extends React.Component {
(
-
+
)}/>
(
-
)} />
diff --git a/src/BooksAPI.js b/src/BooksAPI.js
index 99b00b788e..0a76a1f610 100644
--- a/src/BooksAPI.js
+++ b/src/BooksAPI.js
@@ -23,7 +23,7 @@ export const getAll = () =>
.then(data => data.books)
export const update = (book, shelf) =>
- fetch(`${api}/books/${book.id}`, {
+ fetch(`${api}/books/${book}`, {
method: 'PUT',
headers: {
...headers,
diff --git a/src/Main.js b/src/Main.js
index 66c3250c3a..273416a1cd 100644
--- a/src/Main.js
+++ b/src/Main.js
@@ -1,11 +1,15 @@
import React from 'react'
import './App.css'
-import {Link} from 'react-router-dom'
+import {Link, } from 'react-router-dom'
+
class Main extends React.Component
{
+
render(props)
{
+
+
const books = this.props.books;
const contreading = books.filter((book) =>
@@ -40,15 +44,19 @@ class Main extends React.Component
{
contreading.map((book ) =>
{
+ console.log(book.shelf);
return
-
+
+ {
+ this.props.updatebookshelf(e.target.id , e.target.value);
+ }}>
Move to...
- Currently Reading
+ Currently Reading
Want to Read
Read
None
@@ -80,7 +88,10 @@ class Main extends React.Component
-
+
+ {
+ this.props.updatebookshelf(e.target.id , e.target.value);
+ }}>
Move to...
Currently Reading
Want to Read
@@ -113,7 +124,10 @@ class Main extends React.Component
-
+
+ {
+ this.props.updatebookshelf(e.target.id , e.target.value);
+ }}>
Move to...
Currently Reading
Want to Read
diff --git a/src/Search.js b/src/Search.js
index ecb8d3b9c1..ee5302fe44 100644
--- a/src/Search.js
+++ b/src/Search.js
@@ -1,31 +1,109 @@
import React from 'react'
+import * as BooksAPI from './BooksAPI'
import './App.css'
import {Link} from 'react-router-dom'
class Search extends React.Component
{
+ state = {
+ books : []
+ }
+
+ handleChange = (event) =>
+ {
+
+ console.log(event.target.value);
+ this.searchbooks(event.target.value);
+ }
+
+ searchbooks = async (query) =>
+ {
+ BooksAPI.search(query).then((data) =>
+ {
+
+ console.log(data);
+ if(data === undefined)
+ {
+ console.log(data);
+ }
+ else if(data.error === "empty query")
+ {
+ console.log(data);
+ }
+ else
+ {
+ this.setState({books : data});
+ console.log("hello2");
+ }
+
+ })
+
+
+ }
render()
{
+
return (
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+ {
+
+ this.state.books.map((book ) =>
+ {
+ console.log(book.shelf);
+
+ return
+
+
+
+
+
+ {
+ this.props.updatebookshelf(e.target.id , e.target.value);
+ }}>
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
{book.title}
+
{book.authors}
+
+
+ }) }
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
);
}
}
From 0cf3281901a9a77ff3b96c2bc6b881f6af2174c4 Mon Sep 17 00:00:00 2001
From: Sudhir Kumar <2017ucp1296@mnit.ac.in>
Date: Fri, 5 Jun 2020 01:56:51 +0530
Subject: [PATCH 5/7] feedback update done
---
src/App.js | 2 +-
src/Main.js | 4 +-
src/Search.js | 127 +++++++++++++++++++++++++++-----------------------
3 files changed, 71 insertions(+), 62 deletions(-)
diff --git a/src/App.js b/src/App.js
index 2ca0a4e503..660b892bf2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -61,7 +61,7 @@ class BooksApp extends React.Component {
)}/>
(
-
+
)} />
diff --git a/src/Main.js b/src/Main.js
index 273416a1cd..35334b2c08 100644
--- a/src/Main.js
+++ b/src/Main.js
@@ -7,9 +7,7 @@ class Main extends React.Component
{
render(props)
- {
-
-
+ {
const books = this.props.books;
const contreading = books.filter((book) =>
diff --git a/src/Search.js b/src/Search.js
index ee5302fe44..053a4c6a29 100644
--- a/src/Search.js
+++ b/src/Search.js
@@ -18,28 +18,33 @@ class Search extends React.Component
searchbooks = async (query) =>
{
- BooksAPI.search(query).then((data) =>
+ BooksAPI.search(query).then((data) =>
+ {
+
+ //console.log(data);
+ if(data === undefined)
{
-
console.log(data);
- if(data === undefined)
- {
- console.log(data);
- }
- else if(data.error === "empty query")
- {
- console.log(data);
- }
- else
- {
- this.setState({books : data});
- console.log("hello2");
- }
-
- })
-
+ this.setState({books : []});
+ }
+ else if(data.error === "empty query")
+ {
+ console.log(data);
+ this.setState({books : []});
+ }
+ else
+ {
+ this.setState({books : data});
+ //console.log("hello2");
+ }
+
+ })
+
}
+
+
+
render()
{
@@ -49,7 +54,7 @@ class Search extends React.Component
-
Close
+
Close
@@ -58,47 +63,53 @@ class Search extends React.Component
-
-
-
- {
-
- this.state.books.map((book ) =>
- {
- console.log(book.shelf);
-
- return
-
-
-
-
-
- {
- this.props.updatebookshelf(e.target.id , e.target.value);
- }}>
- Move to...
- Currently Reading
- Want to Read
- Read
- None
-
-
-
-
{book.title}
-
{book.authors}
-
-
- }) }
-
-
-
-
-
-
+ {
+ this.state.books.map((book ) =>
+ {
+
+ this.props.books.map((book1) =>
+ {
+ if(book1.id === book.id)
+ {
+ book.shelf = book1.shelf;
+ }
+ return "";
+ })
-
+ console.log(book);
+
+ if(book.imageLinks === undefined)
+ {
+ book.imageLinks = "";
+ }
+ if(book.authors === undefined)
+ {
+ book.authors = "";
+ }
+ return
+
+
+
+
+
+ {
+ this.props.updatebookshelf(e.target.id , e.target.value);
+ }}>
+ Move to...
+ Currently Reading
+ Want to Read
+ Read
+ None
+
+
+
+
{book.title}
+
{book.authors}
+
+ })
+ }
From 40262e65e394f260c9024aaee617b31c7959ae04 Mon Sep 17 00:00:00 2001
From: Sudhir Kumar <2017ucp1296@mnit.ac.in>
Date: Fri, 5 Jun 2020 01:59:02 +0530
Subject: [PATCH 6/7] some more feedback update
---
src/Search.js | 4 ++++
1 file changed, 4 insertions(+)
diff --git a/src/Search.js b/src/Search.js
index 053a4c6a29..614e466434 100644
--- a/src/Search.js
+++ b/src/Search.js
@@ -76,6 +76,10 @@ class Search extends React.Component
}
return "";
})
+ if(book.shelf === undefined)
+ {
+ book.shelf = "none";
+ }
console.log(book);
From cb0e8241da6043d1fb5ebed3e13264871bb61a8a Mon Sep 17 00:00:00 2001
From: Sudhir Kumar <2017ucp1296@mnit.ac.in>
Date: Fri, 5 Jun 2020 02:05:11 +0530
Subject: [PATCH 7/7] redme update
---
README.md | 9 +++++++++
1 file changed, 9 insertions(+)
diff --git a/README.md b/README.md
index ce4ea2eb85..c49c8891d2 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,14 @@
# MyReads Project
+# updaed by sudhir kumar
+This project was made under udacity react course project , Feel free to give star to the project if you like and also any suggestion if you want to give to make this project good.
+
+
+How to Run the App :-
+ 1 . install all the dependency `npm install`
+ 2 . Run the project on terminal in project folder `npm start`
+
+
This is the starter template for the final assessment project for Udacity's React Fundamentals course. The goal of this template is to save you time by providing a static example of the CSS and HTML markup that may be used, but without any of the React code that is needed to complete the project. If you choose to start with this template, your job will be to add interactivity to the app by refactoring the static code in this template.
Of course, you are free to start this project from scratch if you wish! Just be sure to use [Create React App](https://github.com/facebookincubator/create-react-app) to bootstrap the project.