You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
-42Lines changed: 0 additions & 42 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -20,45 +20,3 @@ Build a React App that displays different categories of current news.
20
20

21
21
22
22
We want to see good commit habits - atomic commits that log small, focused changesets.
23
-
24
-
### Iteration 0
25
-
26
-
Get set up (per the instructions above)!
27
-
28
-
We've provided a boilerplate for you to work with. Look through the file structure to get a sense of the app.
29
-
30
-
Notice that we have multiple stylesheets - one for each component. You are welcome to style this application however you'd like as long as it keeps the core functionality. We got you started with a little styling, but feel free to get creative. (Remember, though - most of your energy should be spent on learning React, not styling.)
31
-
32
-
### Iteration 1
33
-
34
-
Create a NewsContainer component, which will act as a container that renders each of our news articles. For now, the news articles being displayed will be "Local News". Figure out how to pass information from `App.js` to `NewsContainer.js`!
35
-
36
-
Then create a NewsArticle component. Each NewsArticle card will display: the image, the headline, the description, and the url (see the screenshot above for an idea).
37
-
38
-
In your NewsContainer component, create NewsArticle cards that have the information each needs to display properly.
39
-
40
-
**Test that your components are rendering correctly.**
41
-
42
-
### Iteration 2
43
-
44
-
Take a look at the `data` directory and inspect the other news data that is included. There is an `entertainment.js`, `health.js`, `science.js`, and `technology.js` file. Import the data and put it in `App's` state. Create a Menu component that has navigation to display the different news articles. When selecting a navigation link, it should display the relevant news articles in the NewsContainer component. How can you reuse components?
45
-
46
-
**Add/Update any tests necessary. Also add tests for mocking appropriate methods**
47
-
48
-
### Iteration 3 (extension - do not attempt until iterations 0 - 2 are completed)
49
-
50
-
Add in the functionality so that a user can search through the news articles. After a user has typed a search query, a user should either be able to press `Enter` or `Search` to filter out the correct news articles. The search functionality should only filter through the selected news articles.
51
-
52
-
**Add/Update any tests necessary. Remember to include tests for any appropriate new methods you have created**
53
-
54
-
### Iteration 4 (extension - do not attempt until iterations 0 - 3 are completed)
55
-
56
-
Instead of importing the news data from the data directory, use the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) to get the data. Read this [article](https://www.robinwieruch.de/react-fetching-data) on where you should fetch your data in React.
57
-
58
-
Here is what the endpoint looks like to get the news data.
0 commit comments