├── public
    ├── favicon.ico
    ├── logo192.png
    ├── logo512.png
    ├── robots.txt
    ├── manifest.json
    └── index.html
├── src
    ├── App.js
    ├── index.js
    ├── index.css
    └── components
    │   ├── TableData.js
    │   └── Data.js
├── README.md
├── .gitignore
└── package.json


/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asrafaliii/contact_keeper/HEAD/public/favicon.ico


--------------------------------------------------------------------------------
/public/logo192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asrafaliii/contact_keeper/HEAD/public/logo192.png


--------------------------------------------------------------------------------
/public/logo512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/asrafaliii/contact_keeper/HEAD/public/logo512.png


--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 | 


--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
 1 | import TableData from "./components/TableData";
 2 | 
 3 | function App() {
 4 |   return (
 5 |     <div>
 6 |       <TableData />
 7 |     </div>
 8 |   );
 9 | }
10 | 
11 | export default App;
12 | 


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
 1 | import React from "react";
 2 | import ReactDOM from "react-dom/client";
 3 | import "./index.css";
 4 | import App from "./App";
 5 | import "bootstrap/dist/css/bootstrap.min.css";
 6 | 
 7 | const root = ReactDOM.createRoot(document.getElementById("root"));
 8 | root.render(
 9 |   <React.StrictMode>
10 |     <App />
11 |   </React.StrictMode>
12 | );
13 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Search and Filter Data in React
2 | 
3 | This project was react-bootstrapped with [Live]().
4 | 
5 | ## Available Scripts
6 | 
7 | In this video we build out live search functionality using the filter method, map method, and some react state. We import data from "Mockaroo" which is a pretty cool platform that allows you to draft up mock data for use while building applications
8 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | /.pnp
 6 | .pnp.js
 7 | 
 8 | # testing
 9 | /coverage
10 | 
11 | # production
12 | /build
13 | 
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 | 
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 | 


--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
 1 | body {
 2 |   margin: 0;
 3 |   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
 4 |     'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
 5 |     sans-serif;
 6 |   -webkit-font-smoothing: antialiased;
 7 |   -moz-osx-font-smoothing: grayscale;
 8 | }
 9 | 
10 | code {
11 |   font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 |     monospace;
13 | }
14 | 


--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "short_name": "React App",
 3 |   "name": "Create React App Sample",
 4 |   "icons": [
 5 |     {
 6 |       "src": "favicon.ico",
 7 |       "sizes": "64x64 32x32 24x24 16x16",
 8 |       "type": "image/x-icon"
 9 |     },
10 |     {
11 |       "src": "logo192.png",
12 |       "type": "image/png",
13 |       "sizes": "192x192"
14 |     },
15 |     {
16 |       "src": "logo512.png",
17 |       "type": "image/png",
18 |       "sizes": "512x512"
19 |     }
20 |   ],
21 |   "start_url": ".",
22 |   "display": "standalone",
23 |   "theme_color": "#000000",
24 |   "background_color": "#ffffff"
25 | }
26 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "contact-keeper",
 3 |   "version": "0.1.0",
 4 |   "private": true,
 5 |   "dependencies": {
 6 |     "@testing-library/jest-dom": "^5.16.5",
 7 |     "@testing-library/react": "^13.3.0",
 8 |     "@testing-library/user-event": "^13.5.0",
 9 |     "bootstrap": "^5.2.0",
10 |     "react": "^18.2.0",
11 |     "react-bootstrap": "^2.4.0",
12 |     "react-dom": "^18.2.0",
13 |     "react-scripts": "5.0.1",
14 |     "web-vitals": "^2.1.4"
15 |   },
16 |   "scripts": {
17 |     "start": "react-scripts start",
18 |     "build": "react-scripts build",
19 |     "test": "react-scripts test",
20 |     "eject": "react-scripts eject"
21 |   },
22 |   "eslintConfig": {
23 |     "extends": [
24 |       "react-app",
25 |       "react-app/jest"
26 |     ]
27 |   },
28 |   "browserslist": {
29 |     "production": [
30 |       ">0.2%",
31 |       "not dead",
32 |       "not op_mini all"
33 |     ],
34 |     "development": [
35 |       "last 1 chrome version",
36 |       "last 1 firefox version",
37 |       "last 1 safari version"
38 |     ]
39 |   }
40 | }
41 | 


--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8" />
 5 |     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1" />
 7 |     <meta name="theme-color" content="#000000" />
 8 |     <meta
 9 |       name="description"
10 |       content="Web site created using create-react-app"
11 |     />
12 |     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
13 |     <!--
14 |       manifest.json provides metadata used when your web app is installed on a
15 |       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
16 |     -->
17 |     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18 |     <!--
19 |       Notice the use of %PUBLIC_URL% in the tags above.
20 |       It will be replaced with the URL of the `public` folder during the build.
21 |       Only files inside the `public` folder can be referenced from the HTML.
22 | 
23 |       Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24 |       work correctly both with client-side routing and a non-root public URL.
25 |       Learn how to configure a non-root public URL by running `npm run build`.
26 |     -->
27 |     <title>React App</title>
28 |   </head>
29 |   <body>
30 |     <noscript>You need to enable JavaScript to run this app.</noscript>
31 |     <div id="root"></div>
32 |     <!--
33 |       This HTML file is a template.
34 |       If you open it directly in the browser, you will see an empty page.
35 | 
36 |       You can add webfonts, meta tags, or analytics to this file.
37 |       The build step will place the bundled scripts into the <body> tag.
38 | 
39 |       To begin the development, run `npm start` or `yarn start`.
40 |       To create a production bundle, use `npm run build` or `yarn build`.
41 |     -->
42 |   </body>
43 | </html>
44 | 


--------------------------------------------------------------------------------
/src/components/TableData.js:
--------------------------------------------------------------------------------
 1 | import React, { useState } from "react";
 2 | import { Container } from "react-bootstrap";
 3 | import Table from "react-bootstrap/Table";
 4 | import Form from "react-bootstrap/Form";
 5 | import InputGroup from "react-bootstrap/InputGroup";
 6 | import { data } from "../components/Data";
 7 | 
 8 | const TableData = () => {
 9 |   //   const [constacts, setContacts] = useState(data);
10 |   const [search, setSearch] = useState("");
11 | 
12 |   // const sortName = () => {
13 |   //   setContacts(
14 |   //     data.sort((a, b) => {
15 |   //       return a.first_name.toLowerCase() < a.first_name.toLowerCase()
16 |   //         ? -1
17 |   //         : a.first_name.toLowerCase() > a.first_name.toLowerCase()
18 |   //         ? 1
19 |   //         : 0;
20 |   //     })
21 |   //   );
22 |   // };
23 | 
24 |   return (
25 |     <div>
26 |       <Container>
27 |         <h1 className="text-center mt-4">Contact Keeper</h1>
28 |         <Form>
29 |           <InputGroup className="my-3">
30 |             <Form.Control
31 |               onChange={(e) => setSearch(e.target.value)}
32 |               placeholder="Search contacts"
33 |             />
34 |           </InputGroup>
35 |         </Form>
36 |         <Table striped bordered hover>
37 |           <thead>
38 |             <tr>
39 |               <th>First Name</th>
40 |               <th>Last Name</th>
41 |               <th>Email</th>
42 |               <th>Phone</th>
43 |             </tr>
44 |           </thead>
45 |           <tbody>
46 |             {data
47 |               .filter((item) => {
48 |                 return search.toLowerCase() === ""
49 |                   ? item
50 |                   : item.first_name.toLowerCase().includes(search);
51 |               })
52 |               .map((item, index) => (
53 |                 <tr key={index}>
54 |                   <td>{item.first_name}</td>
55 |                   <td>{item.last_name}</td>
56 |                   <td>{item.email}</td>
57 |                   <td>{item.phone}</td>
58 |                 </tr>
59 |               ))}
60 |           </tbody>
61 |         </Table>
62 |       </Container>
63 |     </div>
64 |   );
65 | };
66 | 
67 | export default TableData;
68 | 


--------------------------------------------------------------------------------
/src/components/Data.js:
--------------------------------------------------------------------------------
  1 | export const data = [
  2 |   {
  3 |     id: 1,
  4 |     first_name: "Didi",
  5 |     last_name: "Hedditch",
  6 |     email: "dhedditch0@archive.org",
  7 |     phone: "+351 853 319 1200",
  8 |   },
  9 |   {
 10 |     id: 2,
 11 |     first_name: "Hilario",
 12 |     last_name: "Stollenwerck",
 13 |     email: "hstollenwerck1@geocities.jp",
 14 |     phone: "+86 420 496 2686",
 15 |   },
 16 |   {
 17 |     id: 3,
 18 |     first_name: "Fred",
 19 |     last_name: "Brearton",
 20 |     email: "fbrearton2@amazon.co.uk",
 21 |     phone: "+86 948 417 3781",
 22 |   },
 23 |   {
 24 |     id: 4,
 25 |     first_name: "Shanna",
 26 |     last_name: "Deakes",
 27 |     email: "sdeakes3@macromedia.com",
 28 |     phone: "+976 250 448 4218",
 29 |   },
 30 |   {
 31 |     id: 5,
 32 |     first_name: "Giffy",
 33 |     last_name: "Khosa",
 34 |     email: "gkhosa4@cbc.ca",
 35 |     phone: "+381 922 739 5180",
 36 |   },
 37 |   {
 38 |     id: 6,
 39 |     first_name: "Fancy",
 40 |     last_name: "Sattin",
 41 |     email: "fsattin5@alexa.com",
 42 |     phone: "+33 397 299 1989",
 43 |   },
 44 |   {
 45 |     id: 7,
 46 |     first_name: "Cally",
 47 |     last_name: "Halm",
 48 |     email: "chalm6@pinterest.com",
 49 |     phone: "+7 694 675 5896",
 50 |   },
 51 |   {
 52 |     id: 8,
 53 |     first_name: "Emili",
 54 |     last_name: "Henaughan",
 55 |     email: "ehenaughan7@linkedin.com",
 56 |     phone: "+64 595 128 6185",
 57 |   },
 58 |   {
 59 |     id: 9,
 60 |     first_name: "Dulcinea",
 61 |     last_name: "Kemsley",
 62 |     email: "dkemsley8@cam.ac.uk",
 63 |     phone: "+86 913 947 4591",
 64 |   },
 65 |   {
 66 |     id: 10,
 67 |     first_name: "Frank",
 68 |     last_name: "Ludman",
 69 |     email: "fludman9@seattletimes.com",
 70 |     phone: "+54 478 554 7642",
 71 |   },
 72 |   {
 73 |     id: 11,
 74 |     first_name: "Zane",
 75 |     last_name: "Lenihan",
 76 |     email: "zlenihana@yale.edu",
 77 |     phone: "+382 282 905 6861",
 78 |   },
 79 |   {
 80 |     id: 12,
 81 |     first_name: "Joyce",
 82 |     last_name: "Bastistini",
 83 |     email: "jbastistinib@nbcnews.com",
 84 |     phone: "+62 756 900 2846",
 85 |   },
 86 |   {
 87 |     id: 13,
 88 |     first_name: "Olivier",
 89 |     last_name: "Drinnan",
 90 |     email: "odrinnanc@mayoclinic.com",
 91 |     phone: "+81 905 156 4249",
 92 |   },
 93 |   {
 94 |     id: 14,
 95 |     first_name: "Lucio",
 96 |     last_name: "Edmunds",
 97 |     email: "ledmundsd@canalblog.com",
 98 |     phone: "+47 328 110 0265",
 99 |   },
100 |   {
101 |     id: 15,
102 |     first_name: "Marion",
103 |     last_name: "Dorning",
104 |     email: "mdorninge@cnbc.com",
105 |     phone: "+86 614 888 7733",
106 |   },
107 |   {
108 |     id: 16,
109 |     first_name: "Barbaraanne",
110 |     last_name: "Redmond",
111 |     email: "bredmondf@home.pl",
112 |     phone: "+55 238 595 0830",
113 |   },
114 |   {
115 |     id: 17,
116 |     first_name: "Denney",
117 |     last_name: "Peller",
118 |     email: "dpellerg@cnet.com",
119 |     phone: "+1 975 222 9609",
120 |   },
121 |   {
122 |     id: 18,
123 |     first_name: "George",
124 |     last_name: "Fortun",
125 |     email: "gfortunh@google.co.uk",
126 |     phone: "+7 994 981 0106",
127 |   },
128 |   {
129 |     id: 19,
130 |     first_name: "Lucie",
131 |     last_name: "Getch",
132 |     email: "lgetchi@themeforest.net",
133 |     phone: "+86 508 962 4909",
134 |   },
135 |   {
136 |     id: 20,
137 |     first_name: "Benetta",
138 |     last_name: "Dimbleby",
139 |     email: "bdimblebyj@wunderground.com",
140 |     phone: "+82 388 515 0307",
141 |   },
142 |   {
143 |     id: 21,
144 |     first_name: "Bernarr",
145 |     last_name: "Gouny",
146 |     email: "bgounyk@google.co.uk",
147 |     phone: "+234 265 941 8066",
148 |   },
149 |   {
150 |     id: 22,
151 |     first_name: "Franny",
152 |     last_name: "Maccraw",
153 |     email: "fmaccrawl@ox.ac.uk",
154 |     phone: "+33 109 789 0220",
155 |   },
156 |   {
157 |     id: 23,
158 |     first_name: "Daniella",
159 |     last_name: "Linnemann",
160 |     email: "dlinnemannm@fastcompany.com",
161 |     phone: "+48 766 270 4465",
162 |   },
163 |   {
164 |     id: 24,
165 |     first_name: "Emmit",
166 |     last_name: "Uglow",
167 |     email: "euglown@vk.com",
168 |     phone: "+506 986 599 6074",
169 |   },
170 |   {
171 |     id: 25,
172 |     first_name: "Clarance",
173 |     last_name: "Kyme",
174 |     email: "ckymeo@facebook.com",
175 |     phone: "+380 703 813 2029",
176 |   },
177 |   {
178 |     id: 26,
179 |     first_name: "Lindsy",
180 |     last_name: "Still",
181 |     email: "lstillp@freewebs.com",
182 |     phone: "+7 461 798 0118",
183 |   },
184 |   {
185 |     id: 27,
186 |     first_name: "Emmalyn",
187 |     last_name: "Pole",
188 |     email: "epoleq@cargocollective.com",
189 |     phone: "+55 559 186 8467",
190 |   },
191 |   {
192 |     id: 28,
193 |     first_name: "Alanna",
194 |     last_name: "Fahrenbach",
195 |     email: "afahrenbachr@furl.net",
196 |     phone: "+86 261 444 1663",
197 |   },
198 |   {
199 |     id: 29,
200 |     first_name: "Clo",
201 |     last_name: "Monteith",
202 |     email: "cmonteiths@nhs.uk",
203 |     phone: "+380 221 690 2807",
204 |   },
205 |   {
206 |     id: 30,
207 |     first_name: "Maddalena",
208 |     last_name: "Billie",
209 |     email: "mbilliet@fotki.com",
210 |     phone: "+62 707 710 1422",
211 |   },
212 |   {
213 |     id: 31,
214 |     first_name: "Justino",
215 |     last_name: "Eplett",
216 |     email: "jeplettu@t.co",
217 |     phone: "+86 494 568 5719",
218 |   },
219 |   {
220 |     id: 32,
221 |     first_name: "Philip",
222 |     last_name: "Arsmith",
223 |     email: "parsmithv@google.cn",
224 |     phone: "+86 534 990 7938",
225 |   },
226 |   {
227 |     id: 33,
228 |     first_name: "Gran",
229 |     last_name: "Setford",
230 |     email: "gsetfordw@wikia.com",
231 |     phone: "+62 231 489 5962",
232 |   },
233 |   {
234 |     id: 34,
235 |     first_name: "Leda",
236 |     last_name: "Cretney",
237 |     email: "lcretneyx@hud.gov",
238 |     phone: "+86 528 718 2878",
239 |   },
240 |   {
241 |     id: 35,
242 |     first_name: "Jandy",
243 |     last_name: "Ruselin",
244 |     email: "jruseliny@bizjournals.com",
245 |     phone: "+970 660 382 6684",
246 |   },
247 |   {
248 |     id: 36,
249 |     first_name: "Matthias",
250 |     last_name: "Swinnard",
251 |     email: "mswinnardz@lulu.com",
252 |     phone: "+27 390 241 4911",
253 |   },
254 |   {
255 |     id: 37,
256 |     first_name: "Keely",
257 |     last_name: "Eynald",
258 |     email: "keynald10@miibeian.gov.cn",
259 |     phone: "+62 199 175 9531",
260 |   },
261 |   {
262 |     id: 38,
263 |     first_name: "Lyndel",
264 |     last_name: "Shillan",
265 |     email: "lshillan11@jiathis.com",
266 |     phone: "+55 205 924 0945",
267 |   },
268 |   {
269 |     id: 39,
270 |     first_name: "Gallard",
271 |     last_name: "O'Dea",
272 |     email: "godea12@virginia.edu",
273 |     phone: "+62 846 517 0741",
274 |   },
275 |   {
276 |     id: 40,
277 |     first_name: "Rycca",
278 |     last_name: "Sissel",
279 |     email: "rsissel13@cbc.ca",
280 |     phone: "+420 713 201 3576",
281 |   },
282 |   {
283 |     id: 41,
284 |     first_name: "Bondy",
285 |     last_name: "Vasishchev",
286 |     email: "bvasishchev14@arizona.edu",
287 |     phone: "+86 269 727 1287",
288 |   },
289 |   {
290 |     id: 42,
291 |     first_name: "Zacharie",
292 |     last_name: "Schimann",
293 |     email: "zschimann15@cam.ac.uk",
294 |     phone: "+351 487 147 9915",
295 |   },
296 |   {
297 |     id: 43,
298 |     first_name: "Cele",
299 |     last_name: "Peskett",
300 |     email: "cpeskett16@techcrunch.com",
301 |     phone: "+7 495 120 9182",
302 |   },
303 |   {
304 |     id: 44,
305 |     first_name: "Horten",
306 |     last_name: "Assiter",
307 |     email: "hassiter17@jalbum.net",
308 |     phone: "+86 658 602 0459",
309 |   },
310 |   {
311 |     id: 45,
312 |     first_name: "Willyt",
313 |     last_name: "Mordan",
314 |     email: "wmordan18@icq.com",
315 |     phone: "+7 729 536 4108",
316 |   },
317 |   {
318 |     id: 46,
319 |     first_name: "Janna",
320 |     last_name: "D'eye",
321 |     email: "jdeye19@nydailynews.com",
322 |     phone: "+64 212 295 1574",
323 |   },
324 |   {
325 |     id: 47,
326 |     first_name: "Eugenio",
327 |     last_name: "Aysik",
328 |     email: "eaysik1a@google.com.au",
329 |     phone: "+86 152 485 8731",
330 |   },
331 |   {
332 |     id: 48,
333 |     first_name: "Dody",
334 |     last_name: "Jorn",
335 |     email: "djorn1b@domainmarket.com",
336 |     phone: "+977 348 905 8324",
337 |   },
338 |   {
339 |     id: 49,
340 |     first_name: "Normand",
341 |     last_name: "Loseby",
342 |     email: "nloseby1c@google.co.uk",
343 |     phone: "+62 282 557 3746",
344 |   },
345 |   {
346 |     id: 50,
347 |     first_name: "Murielle",
348 |     last_name: "Doni",
349 |     email: "mdoni1d@google.com.au",
350 |     phone: "+81 560 378 7845",
351 |   },
352 |   {
353 |     id: 51,
354 |     first_name: "Jessalin",
355 |     last_name: "Ratie",
356 |     email: "jratie1e@mapy.cz",
357 |     phone: "+1 415 789 2770",
358 |   },
359 |   {
360 |     id: 52,
361 |     first_name: "Frederico",
362 |     last_name: "Manueli",
363 |     email: "fmanueli1f@youtu.be",
364 |     phone: "+351 140 378 1843",
365 |   },
366 |   {
367 |     id: 53,
368 |     first_name: "Sheilah",
369 |     last_name: "Kleehuhler",
370 |     email: "skleehuhler1g@geocities.com",
371 |     phone: "+359 766 297 2972",
372 |   },
373 |   {
374 |     id: 54,
375 |     first_name: "Ailey",
376 |     last_name: "Gianotti",
377 |     email: "agianotti1h@gmpg.org",
378 |     phone: "+7 862 327 2576",
379 |   },
380 |   {
381 |     id: 55,
382 |     first_name: "Clari",
383 |     last_name: "Tunna",
384 |     email: "ctunna1i@cdc.gov",
385 |     phone: "+86 733 394 3941",
386 |   },
387 |   {
388 |     id: 56,
389 |     first_name: "Washington",
390 |     last_name: "Iapico",
391 |     email: "wiapico1j@columbia.edu",
392 |     phone: "+66 395 626 8744",
393 |   },
394 |   {
395 |     id: 57,
396 |     first_name: "Beitris",
397 |     last_name: "Slator",
398 |     email: "bslator1k@technorati.com",
399 |     phone: "+351 242 343 4652",
400 |   },
401 |   {
402 |     id: 58,
403 |     first_name: "Myles",
404 |     last_name: "Whenham",
405 |     email: "mwhenham1l@facebook.com",
406 |     phone: "+255 305 353 2926",
407 |   },
408 |   {
409 |     id: 59,
410 |     first_name: "Catarina",
411 |     last_name: "Tooth",
412 |     email: "ctooth1m@alexa.com",
413 |     phone: "+420 944 730 7945",
414 |   },
415 |   {
416 |     id: 60,
417 |     first_name: "Charin",
418 |     last_name: "Hattiff",
419 |     email: "chattiff1n@japanpost.jp",
420 |     phone: "+33 833 977 1047",
421 |   },
422 |   {
423 |     id: 61,
424 |     first_name: "Constantine",
425 |     last_name: "Armin",
426 |     email: "carmin1o@blogspot.com",
427 |     phone: "+963 251 682 6742",
428 |   },
429 |   {
430 |     id: 62,
431 |     first_name: "Jeri",
432 |     last_name: "Golt",
433 |     email: "jgolt1p@amazon.com",
434 |     phone: "+30 394 919 1819",
435 |   },
436 |   {
437 |     id: 63,
438 |     first_name: "Kendrick",
439 |     last_name: "Elston",
440 |     email: "kelston1q@booking.com",
441 |     phone: "+46 725 514 0589",
442 |   },
443 |   {
444 |     id: 64,
445 |     first_name: "Paige",
446 |     last_name: "Carbonell",
447 |     email: "pcarbonell1r@auda.org.au",
448 |     phone: "+62 234 611 1362",
449 |   },
450 |   {
451 |     id: 65,
452 |     first_name: "Kailey",
453 |     last_name: "Buswell",
454 |     email: "kbuswell1s@multiply.com",
455 |     phone: "+48 299 517 9589",
456 |   },
457 |   {
458 |     id: 66,
459 |     first_name: "Anette",
460 |     last_name: "Bourley",
461 |     email: "abourley1t@economist.com",
462 |     phone: "+63 541 962 7132",
463 |   },
464 |   {
465 |     id: 67,
466 |     first_name: "Lyda",
467 |     last_name: "Kearn",
468 |     email: "lkearn1u@cbsnews.com",
469 |     phone: "+48 506 592 6660",
470 |   },
471 |   {
472 |     id: 68,
473 |     first_name: "Alli",
474 |     last_name: "Tarbett",
475 |     email: "atarbett1v@japanpost.jp",
476 |     phone: "+380 836 730 4874",
477 |   },
478 |   {
479 |     id: 69,
480 |     first_name: "Juieta",
481 |     last_name: "MacNab",
482 |     email: "jmacnab1w@acquirethisname.com",
483 |     phone: "+66 237 684 8764",
484 |   },
485 |   {
486 |     id: 70,
487 |     first_name: "Theodor",
488 |     last_name: "Mikalski",
489 |     email: "tmikalski1x@reddit.com",
490 |     phone: "+62 760 360 7190",
491 |   },
492 |   {
493 |     id: 71,
494 |     first_name: "Sigrid",
495 |     last_name: "McGeagh",
496 |     email: "smcgeagh1y@ihg.com",
497 |     phone: "+7 919 587 3349",
498 |   },
499 |   {
500 |     id: 72,
501 |     first_name: "Allx",
502 |     last_name: "Bulstrode",
503 |     email: "abulstrode1z@devhub.com",
504 |     phone: "+62 259 476 2699",
505 |   },
506 |   {
507 |     id: 73,
508 |     first_name: "Torie",
509 |     last_name: "Yockley",
510 |     email: "tyockley20@bandcamp.com",
511 |     phone: "+86 632 111 0880",
512 |   },
513 |   {
514 |     id: 74,
515 |     first_name: "Rosette",
516 |     last_name: "Iannuzzi",
517 |     email: "riannuzzi21@live.com",
518 |     phone: "+351 899 621 9678",
519 |   },
520 |   {
521 |     id: 75,
522 |     first_name: "Marylin",
523 |     last_name: "Teall",
524 |     email: "mteall22@pbs.org",
525 |     phone: "+7 457 287 1551",
526 |   },
527 |   {
528 |     id: 76,
529 |     first_name: "Eziechiele",
530 |     last_name: "Caller",
531 |     email: "ecaller23@google.cn",
532 |     phone: "+86 732 550 7080",
533 |   },
534 |   {
535 |     id: 77,
536 |     first_name: "Kenn",
537 |     last_name: "Drance",
538 |     email: "kdrance24@feedburner.com",
539 |     phone: "+63 814 841 8612",
540 |   },
541 |   {
542 |     id: 78,
543 |     first_name: "Maxy",
544 |     last_name: "Claffey",
545 |     email: "mclaffey25@eventbrite.com",
546 |     phone: "+86 272 763 7119",
547 |   },
548 |   {
549 |     id: 79,
550 |     first_name: "Upton",
551 |     last_name: "Borris",
552 |     email: "uborris26@joomla.org",
553 |     phone: "+7 637 573 1347",
554 |   },
555 |   {
556 |     id: 80,
557 |     first_name: "Killy",
558 |     last_name: "Wardel",
559 |     email: "kwardel27@bigcartel.com",
560 |     phone: "+228 668 693 2614",
561 |   },
562 |   {
563 |     id: 81,
564 |     first_name: "Claudell",
565 |     last_name: "Toten",
566 |     email: "ctoten28@artisteer.com",
567 |     phone: "+44 543 942 8131",
568 |   },
569 |   {
570 |     id: 82,
571 |     first_name: "Jaimie",
572 |     last_name: "Denford",
573 |     email: "jdenford29@paypal.com",
574 |     phone: "+54 323 542 7092",
575 |   },
576 |   {
577 |     id: 83,
578 |     first_name: "Rosette",
579 |     last_name: "Lensch",
580 |     email: "rlensch2a@sohu.com",
581 |     phone: "+62 898 249 0313",
582 |   },
583 |   {
584 |     id: 84,
585 |     first_name: "Anthiathia",
586 |     last_name: "Iacovo",
587 |     email: "aiacovo2b@lulu.com",
588 |     phone: "+47 557 372 0306",
589 |   },
590 |   {
591 |     id: 85,
592 |     first_name: "Veradis",
593 |     last_name: "Doole",
594 |     email: "vdoole2c@godaddy.com",
595 |     phone: "+254 748 853 7222",
596 |   },
597 |   {
598 |     id: 86,
599 |     first_name: "Townie",
600 |     last_name: "Girodin",
601 |     email: "tgirodin2d@msn.com",
602 |     phone: "+1 225 911 4738",
603 |   },
604 |   {
605 |     id: 87,
606 |     first_name: "Allen",
607 |     last_name: "Simmonett",
608 |     email: "asimmonett2e@edublogs.org",
609 |     phone: "+7 870 388 6113",
610 |   },
611 |   {
612 |     id: 88,
613 |     first_name: "Gilburt",
614 |     last_name: "Burr",
615 |     email: "gburr2f@uol.com.br",
616 |     phone: "+86 905 989 7913",
617 |   },
618 |   {
619 |     id: 89,
620 |     first_name: "Aldon",
621 |     last_name: "Brookes",
622 |     email: "abrookes2g@yolasite.com",
623 |     phone: "+972 178 464 0049",
624 |   },
625 |   {
626 |     id: 90,
627 |     first_name: "Daune",
628 |     last_name: "Bentick",
629 |     email: "dbentick2h@oakley.com",
630 |     phone: "+7 737 114 4499",
631 |   },
632 |   {
633 |     id: 91,
634 |     first_name: "Eugene",
635 |     last_name: "Skain",
636 |     email: "eskain2i@instagram.com",
637 |     phone: "+420 162 886 8772",
638 |   },
639 |   {
640 |     id: 92,
641 |     first_name: "Matti",
642 |     last_name: "Trayton",
643 |     email: "mtrayton2j@soundcloud.com",
644 |     phone: "+31 143 756 8616",
645 |   },
646 |   {
647 |     id: 93,
648 |     first_name: "Chrysler",
649 |     last_name: "Foulcher",
650 |     email: "cfoulcher2k@woothemes.com",
651 |     phone: "+46 130 836 7558",
652 |   },
653 |   {
654 |     id: 94,
655 |     first_name: "Pietrek",
656 |     last_name: "Thomassin",
657 |     email: "pthomassin2l@tumblr.com",
658 |     phone: "+370 507 926 4472",
659 |   },
660 |   {
661 |     id: 95,
662 |     first_name: "Cristin",
663 |     last_name: "MacKay",
664 |     email: "cmackay2m@theguardian.com",
665 |     phone: "+385 863 513 1665",
666 |   },
667 |   {
668 |     id: 96,
669 |     first_name: "Miguelita",
670 |     last_name: "Dawid",
671 |     email: "mdawid2n@fastcompany.com",
672 |     phone: "+237 757 290 8693",
673 |   },
674 |   {
675 |     id: 97,
676 |     first_name: "Enoch",
677 |     last_name: "Bomb",
678 |     email: "ebomb2o@rambler.ru",
679 |     phone: "+48 345 901 8170",
680 |   },
681 |   {
682 |     id: 98,
683 |     first_name: "Franz",
684 |     last_name: "Towlson",
685 |     email: "ftowlson2p@cnet.com",
686 |     phone: "+51 224 795 1146",
687 |   },
688 |   {
689 |     id: 99,
690 |     first_name: "Kippie",
691 |     last_name: "Millwater",
692 |     email: "kmillwater2q@opensource.org",
693 |     phone: "+62 407 615 0606",
694 |   },
695 |   {
696 |     id: 100,
697 |     first_name: "Vally",
698 |     last_name: "Tumayan",
699 |     email: "vtumayan2r@aboutads.info",
700 |     phone: "+62 537 998 2860",
701 |   },
702 | ];
703 | 


--------------------------------------------------------------------------------