Render posts by using HackerNews API
API is HackerNews API
demo with full finctionality
The repo will give you a basic understanding of ReactJS through building a very simple app.
- clone repo
- git reset --hard v1.0
- cd hackernews-app
- activate a node version (nvm use v8.12.0)
- yarn install
- yarn start
- and browser open by default to http://localhost:3000
- v1.0 - initial setup by create-react-app
- v1.1 - create a simple component
- v1.2 - render a list of items (sample data)
- v1.3 - fecth the data from external API
How to use tags
$ git reset --hard v1.?
- create 2 components: UserInput and UserOutput
- UserInput should hold an input element, UserOutput two paragraphs
- output multiple UserOutput components in the App component (any paragraph texts of your choice)
- pass a username (of your choice) to UserOutput via props and display it there
- add state to the App component (=> the username) and pass the username to the UserOutput component
- add a method to manipulate the state (=> an event-handler method)
- pass the event-handler method reference to the UserInput component and bind it to the input-change event
- ensure that the new input entered by the user overwrites the old username passed to UserOutput
- add two-way-binding to your input (in UserInput) to also display the starting username
- add styling of your choice to your components/ elements in the components - both with inline styles and stylesheets
- validate props for your custom component