/vue_resonate_contacts

vue_resonate_contacts

Primary LanguageVue

📱 Responsive "Contacts Application

Summary:

This application was built using Vue 3 for a technical take home assessment for a Software Engineering role.

📜 The Requirements:

I was tasked with the following:

Brief: Write a responsive “Contacts” application that allows the user to browse their contacts.

  • Fetch user data from https://jsonplaceholder.typicode.com/ (/users are the contacts) (Free fake API for testing and prototyping.)
  • Acceptable frameworks: VueJS, Angular or React
  • Make it visually appealing
  • CRUD operations not necessary
  • Provide instructions on how to run the code

💡The Solution:

Framework:

  • Vue.js

IDE:

  • VS Code

Deployed on:

  • Netlify

📖 How to run the application:

  1. Click here to use the deployed application
  2. Scroll to see contacts
  3. Click "More +" to see contact details or "Hide -" to hide them
  4. Click on the search bar and enter your query (you will be shown results of search)

📸: Screenshots:

Main View:

image

Contact Details:

image

Search Query results for 's':

image

Search Query error handling:

image