This repo is designed to provide space to code a fullstack app. It contains node modules and folders for databases, routes, API requests and React components that'll use React Query. Let's get going!

• Clone this repo, navigate to it, install packages, and start the server with npm run dev

  Tip

  You may also want to start a new branch

  cd my-fullstack-collection
  npm i
  git checkout -b <branchname>
  npm run dev

• First, decide what you would like to keep a collection of. This could be a repo for keeping track of movies, books, gifs, cars, rocks, anything you fancy, but keep it simple!

  More about your collection

  Note: the aim is to have some simple data. If you think you might need more than one database table, or have lots of details you want to store, how could you simplify the information you're keeping track of? Leave more complex data until later in the project. For example, I want to keep track of books that I want to read, ones that I have read, and ones that I own. To start with though, let's keep track of the books themselves. My data might look like:

  id	title	author
  1	Ready Player One	Ernest Cline
  2	Throwing Rocks at the Google Bus	Douglas Rushkoff

Our first job is getting something showing on the front end from our database. Here's a list of steps in case they are useful. You can build in any order you like though ;)

• Design a database to store a list of your things (e.g. books)
• Build the migrations and seed data

• Build an API (back end route) to get the information from your database
• Test your API with Insomnia

• Build a React component with static html

• Build an API client in the front end to request the information from your routes

• Write a query with the useQuery hook to fetch the collection data from the API
• Display the collection data you queried in a component (you may want to create a new component for this)

• (Optional) Create a new component for your new collection item form
• Mutate data with the useMutation hook to create a new collection item via the API

• Mutate data with the useMutation hook to delete an exisiting collection item via the API (you may want to add this to your collection display component)

• (Optional) Create a new component for your update collection item form
• Mutate data with the useMutation hook to update an exisiting collection item via the API

Provide feedback on this repo