nsLittle / contact-list-nextjs

Contact List Eval in NextJS

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Contact List

This project was created by Mutsumi Hata, a student at Parsity, an online software engineering program. The work in this repository is wholly of the student based on a sample starter project that can be accessed by looking at the repository that this project forks.

If you have any questions about this project or the program in general, visit parsity.io or email hello@parsity.io.

Project Description

This simple application allows a user to store, add and search through a list of contacts.

Using React keeps various components in their own files, reducing the length of any one file.

Using Typescripts catches errors before execution.

I would like to learn about and use useContext(), useEffect(), and PropTypes.

Table of Contents

ContactList

  • contacts
    • page.js
  • [name]
    • page.js
  • Data
    • page.js
  • new
    • page.js
  • search
    • page.js
  • globals.css
  • layout.js
  • page.js

How to Run App

  1. Open terminal
  2. Locate file: contact-list-nextjs
  3. Type: npm run dev
  4. Type: open http://localhost:3000

Things to Add/Edit

  1. Other Typescript types???
  2. Add functionality to Edit button for each contact
  3. Add functiopnality to Delete button for each contact
  4. Eliminate %20 from [name] url
  5. Use Bootstrap to make columns align, especially subheader of AllContacts
  6. Hide Home/Back button on home page

About

Contact List Eval in NextJS


Languages

Language:TypeScript 76.6%Language:CSS 22.8%Language:JavaScript 0.6%