Car Information Gallery with ReactJS
January 05, 2018
Made with: ReactJS
Gallery of tiles displaying information about different cars. Includes button to load more cars, and a form to add new cars to the gallery.
At its initial state, the app displays four cards for four different cars. If you click on the “Load More" button, it will display four more cards. There is also a brief form where users can add new cars to the gallery.
The main topics and techniques that I learned or practiced through this project are:
- How to use the
create-react-app. This app simplifies your ReactJS development process by providing all the scaffolding necessary to start coding right away. It even gives you the option to fire up a development server that refreshes automatically every time you make and save a change.
- Practice ES6 concepts like classes, arrow functions and modules.
- How to work with props (properties) and
- How to work with components and the import and export syntax in order to link different ReactJS files to make them work together.
- Understand the difference between the development and the production environments.
Note: For this project I followed this ReactJS tutorial as a guide. It has a more detailed explanation of each step if you want to take a look or try it out yourself.