@Ifycode/buuks-react-client

Hosted on Netlify: https://buuks.netlify.app

#

This is the frontend client for the buuks-express-api, built with react, typescript and tailwind css. Through the app's user interface, an (authenticated) user to interact with a database made for storing books. The app is able to do the following:

• User signup and login (authentication)
• Create Read Update Delete operations for books which are saved in the database
• PDF file upload to Cloudinary

Run client app in development

The buuks client app is created with create-react-app and therefore runs at localhost port 3000. Use the command below to start the client app in development:

yarn start

Connecting to backend/database in development

Add the line below in the client app's .env file to connect to the heroku backend deployment:

REACT_APP_BASE_URL=https://buuks-express-api.herokuapp.com

Alternatively, run the backend repo locally on your computer. Then use the localhost url you supplied as the API_HOST_URL from the backend's .env file, as the value for REACT_APP_BASE_URL in the client app's .env file.

Helpful resources

• For conditional header links rendering: MWO's answer to stackoverflow question | Hide a component in Login in react Routes

• For navigating to another page on button click: Mohamed MILADI's useNavigate answer | Attempted import error: 'useHistory' is not exported from 'react-router-dom'

• For PDF and form-data upload: StackedQ's answer to stackoverfolow question: How to send values like form-data postman - react js

• For PDF and form-data upload: MDN - A special case: sending files

• For PDF and form-data upload: handelChangeImage function from Ana Jentel's stackoverflow question

• window.atob() github comment