How To Build A Contact Manager Application With Next JS, Auth0 and Fauna

This page summarizes the projects mentioned and recommended in the original post on dev.to

SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
surveyjs.io
featured
InfluxDB - Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com
featured
  • nextjs-auth0

    Next.js SDK for signing in with Auth0

  • As we're using NextJS, we need to select regular web applications. After creating the application, we should redirect to its settings page. Scroll down and edit the application URL as shown below, then save your changes. You can check auth0 next.js documentation here.

  • contactify

  • Do you have something to add to this project? kindly let me know. You can reach out to me via Twitter. If you like this project, kindly give it a star on GitHub. You can also check out the deployed app here.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • React

    The library for web and native user interfaces.

  • Knowledge of React and JSX.

  • Next.js

    The React Framework

  • // Next.js API route support: https://nextjs.org/docs/api-routes/introduction import { withApiAuthRequired ,getSession } from "@auth0/nextjs-auth0" import { deleteContact, getContact, updateContact } from "../../../models" export default withApiAuthRequired(async (req, res) => { const user = getSession(req, res).user if (req.method === 'PUT') { let contact = await updateContact( req.body, req.query.id ) res.status(201).json({ message: "Successfully updated contact", data: contact, status: 'ok' }) } else if (req.method === 'GET') { let contact = await getContact(req.query.id) res.status(200).json({ message: "Successfully retrieved contact", data: contact, status: 'ok' }) } else if (req.method === 'DELETE') { let contact = await getContact(req.query.id) if (contact.user.id !== user.sub) { return res.status(403).json({ message: "Forbidden", status: false, data: null }) } contact = await deleteContact(req.query.id) res.status(200).json({ message: "Successfully deleted contact", data: contact, status: 'ok' }) } else { res.status(405).json({ message: 'Method not allowed', data: null, status: false }) } })

  • faunadb-js

    Javascript driver for FaunaDB v4

  • This article will demonstrate how to build a contact manager with Next.js and Fauna by walking you through the process of building a Google contact application clone.

  • Express

    Fast, unopinionated, minimalist web framework for node.

  • Basic knowledge of Express.js

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts

  • I developed a simple but beautiful developer portfolio template using React and Next.js

    3 projects | dev.to | 31 Jan 2023
  • Meet Cheryl Murphy: Full-Stack Developer, lifelong learner, and volunteer Project Team Lead at Web Dev Path

    2 projects | dev.to | 22 Apr 2024
  • 7 Frameworks, One SAML Jackson - Your Open Source Single Sign-On Solution

    9 projects | dev.to | 3 Apr 2024
  • Building a Dynamic Job Board with Issues Github, Next.js, Tailwind CSS and MobX-State-Tree

    6 projects | dev.to | 28 Mar 2024
  • What is the ideal Tech stack to build a website in 2024? 👨‍💻

    2 projects | dev.to | 23 Jan 2024