Clone the repository and follow:
yarn install
yarn dev
You will see the login page as shown below. If you enter the correct values for orderNo and zipCode, then you will be able to see the order detail page.
![Screenshot 2023-10-25 at 10 10 04](https://private-user-images.githubusercontent.com/34961348/277919810-dc5157e0-af37-46ba-b78a-1dc2b795a7f3.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5MTk4MTAtZGM1MTU3ZTAtYWYzNy00NmJhLWI3OGEtMWRjMmI3OTVhN2YzLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTZjZTc2YTNkYjEwNDBmNDA5YjY3MDBmNjdlMDBlNGMwOTE5NDNiMjAzMjZlZmFiZWZhM2NmNTY4MDk4NzY1OWQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.dhnXBd0rh3-JksMTscqd-nUyo0wT336CNmdAR3cC0Y4)
One good example: orderNo = 0000RTAB3
zip_code = 81371
http://localhost:3000/order?orderNo=0000RTAB3&zip_code=81371
![Screenshot 2023-10-25 at 10 02 36](https://private-user-images.githubusercontent.com/34961348/277919658-256edff0-5011-4121-ad6d-132845b4fbbd.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5MTk2NTgtMjU2ZWRmZjAtNTAxMS00MTIxLWFkNmQtMTMyODQ1YjRmYmJkLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTA3NTM0NGE3NTI2NTVhN2JjZTBjZTQ5OWFlNWNjNTUzNGMxMjIwNTg3NzQ1NWE5ODRkZTkyY2U5MmE2NzA2MTImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.sONkIkrPC3EV9B_nkLs_MPMigqDfXoobka1YfMp7v6A)
The app is mobile optimized!
![Screenshot 2023-10-24 at 23 17 02](https://private-user-images.githubusercontent.com/34961348/277920343-5ca36f60-f280-4caf-a73a-9d9b14973cc1.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5MjAzNDMtNWNhMzZmNjAtZjI4MC00Y2FmLWE3M2EtOWQ5YjE0OTczY2MxLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWYzOWY3YWMzNWI5ZWYyYzM1NGRiYmE2N2U0MDEyYmVhYjU4YTBhYmNkODNjODljYjkwNTJlNjA3ZWNiOTY3MmYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.L07OGKBHlFohdwnY49ZaJkg96y8BWkDPDrtg4nPdaSo)
![Screenshot 2023-10-24 at 23 16 57](https://private-user-images.githubusercontent.com/34961348/277920333-b7847c36-e3c7-4d60-ae4e-2e016b346bde.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5MjAzMzMtYjc4NDdjMzYtZTNjNy00ZDYwLWFlNGUtMmUwMTZiMzQ2YmRlLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTk3YzVhODAwYjBjZmExOWM0YjE4M2U3MTY3Y2Q1MTUzMzJiOTYyNWE1NjFiNzQ0NzE1ZjJlYTE5ZmY4NmYxZDQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.vObsRfcrmp0eZvCkJLGl00V--SMWKtzwFYsF5y3MzAk)
![Screenshot 2023-10-24 at 23 16 00](https://private-user-images.githubusercontent.com/34961348/277920322-c6c208b4-e468-4867-942c-d12b35f7d296.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5MjAzMjItYzZjMjA4YjQtZTQ2OC00ODY3LTk0MmMtZDEyYjM1ZjdkMjk2LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTc0MzNhYTJhYWUzNTg1NDA3ZGU1ZjE3NDMxZjg0Mzk3ZjdjNjJlZGY1NGQ4ZTQ0YmUzNjE1MTQ2MTJjZTNhNzcmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.AIHX_sEk5M2EETLXCocU3Xafr9LxpuEgCxWcGvhBqmI)
You can check and challenge the tests running the following command.
yarn test
![Screenshot 2023-10-25 at 11 55 35](https://private-user-images.githubusercontent.com/34961348/277951593-4b170cee-396f-4e0b-b343-db671212f647.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NjY5NTIsIm5iZiI6MTcyNDQ2NjY1MiwicGF0aCI6Ii8zNDk2MTM0OC8yNzc5NTE1OTMtNGIxNzBjZWUtMzk2Zi00ZTBiLWIzNDMtZGI2NzEyMTJmNjQ3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI0VDAyMzA1MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTM0OTdiZmY2ZGU2Zjg4NTNjOWY2MzE0OTAxY2Q3NGUwODFiNTAyMjZkZTc1NWU3YWI0MWRiMDE5NTViNzMxODYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.lNsp3L2e6_hpCkkTLdRlV69lJYlCYZ7CKf3ESadpemo)
Post requests done by axios
. If you need to check how this works with real endpoint that is shared in the challenge. You just need to update the baseUrl in the file lib/axios.ts
Mock apis are created by next using node
UI element created by shadcn https://ui.shadcn.com/ This is the installation of the shadcn -> https://ui.shadcn.com/docs/installation/next
Tailwind is heavily used for any kind of adjustment in the ui. Tests are completed by jest and react testing library.
Let me know if you need anything! Enjoy reviewing it!