gonzalez-aj

Search bar with dynamic routing using Next.JS in React and Fetch

Today I learned how to create a search bar to search through my data and push the result to a dynamically routed page. I searched some ways to ways to build the search bar without using the hook useRouter()

• Link 1
• Link 2
• A long Video
• A succinct video!

gonzalez-aj

1. Create your models
   • This is how you define the data stored in the database and how that data is saved
2. Create your forms (using ModelForm: https://docs.djangoproject.com/en/4.2/topics/forms/modelforms)
3. Created view
   • This makes the data (aka: context) available to the html template
4. Create the template that interpolates the data from the view
   • This renders the form
5. Create a URL that serves the view to users
   • EXAMPLE:

gonzalez-aj

//repos
const pinnedRepos = [
  {
     id: 1,
     type: 'Overview',
     name: "gatsby-workshop",
     description: "This workshop covers the fundamentals of developing fast, accesible sites with Gatsby, a React framework, and dive deep into the building blocks you'll need to build your own custom Gatsby sites."
  },
  {
    id: 2,

gonzalez-aj

//repos
const pinnedRepos = [
  {
     id: 1,
     type: 'Overview',
     name: "gatsby-workshop",
     description: "This workshop covers the fundamentals of developing fast, accesible sites with Gatsby, a React framework, and dive deep into the building blocks you'll need to build your own custom Gatsby sites."
  },
  {
    id: 2,