{"id":19756696,"url":"https://github.com/ayushsgithub/viewai_task","last_synced_at":"2025-08-05T09:22:43.068Z","repository":{"id":243231539,"uuid":"811696401","full_name":"ayushsgithub/viewai_task","owner":"ayushsgithub","description":"https://viewai-task.vercel.app/","archived":false,"fork":false,"pushed_at":"2024-06-07T17:57:18.000Z","size":815,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-28T09:11:58.481Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://viewai-task.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ayushsgithub.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-06-07T05:53:00.000Z","updated_at":"2024-06-16T09:03:28.000Z","dependencies_parsed_at":"2024-06-07T14:03:32.331Z","dependency_job_id":"40e4d02a-bd06-4825-88e3-6a7e775a5b9c","html_url":"https://github.com/ayushsgithub/viewai_task","commit_stats":null,"previous_names":["ayushsgithub/viewai_task"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ayushsgithub/viewai_task","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayushsgithub%2Fviewai_task","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayushsgithub%2Fviewai_task/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayushsgithub%2Fviewai_task/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayushsgithub%2Fviewai_task/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ayushsgithub","download_url":"https://codeload.github.com/ayushsgithub/viewai_task/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayushsgithub%2Fviewai_task/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268868022,"owners_count":24320486,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-05T02:00:12.334Z","response_time":2576,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-12T03:16:39.110Z","updated_at":"2025-08-05T09:22:42.970Z","avatar_url":"https://github.com/ayushsgithub.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Front-End Engineer Assessment Task for ViewAI\n\n## Overview\n\nThe purpose of this interview project is to assess the candidate's proficiency in front-end development, particularly in areas critical for the role, such as API interaction, data parsing, and UI development.\n\n## Teck Stack\n\n```\nNext.js, React, TypeScript, Tailwind CSS, ShadCn, Framer Motion, Aceternity UI, Random User API, Vercel\n```\n\n## Task\n\nDeveloped a simple application to fetch and display data from the API given below in the form of a table. The table should include the following fields:\n- City\n- State\n- Country\n- Postcode\n- Number\n- Name\n- Latitude\n- Longitude\n\n### API Endpoint\n```\nhttps://randomuser.me/api/?results=20\n```\n\n## Submission Guidelines\n\n- Complete the task within the 48-hour window.\n- Provide a link to a GitHub repository containing your code.\n- Ensure the repository includes a README file with instructions on how to run your application.\n\n## Project Setup\n\nFollow these steps to set up and run the project on your local machine.\n\n### Prerequisites\n\nEnsure you have the following software installed:\n- [Next.js](https://nextjs.org/) (LTS version recommended)\n- [Git](https://git-scm.com/)\n\n### Cloning the Repository\n\nClone the repository to your local machine using the following command:\n\n```bash\ngit clone https://github.com/ayushsgithub/viewai_task.git\n```\n\n### Installing Dependencies\n\nNavigate to the project directory and install the required dependencies using npm or yarn:\n\n```bash\ncd viewai_task\nnpm install\n```\n\n### Running the Application\n\nStart the application in development mode with the following command:\n\n```bash\nnpm run dev\n```\n\n\nThe application will run on `http://localhost:3000`. Open this URL in your web browser to view the application.\n\n### Building for Production\n\nTo build the application for production, use the following command:\n\n```bash\nnpm run build\n```\n\n\nThis will create a `build` directory with the production build of your application.\n\n## Application Structure\n\nHere's a brief overview of the project's structure:\n\n```\nviewai_task\n│\n├── app\n│   ├── components\n│   ├── utils\n│   ├── layout.tsx\n│   ├── page.tsx\n│   └── ...\n│\n├── components\n│   ├── ui\n│   │   └── table.tsx\n│   └── ...\n│\n├── public\n├── components.json\n├── next.config.ts\n├── package.json\n├── README.md\n└── ...\n```\n\n- `public/` - Contains svgs and static assets.\n- `app/` - Contains the React components and main application logic.\n- `package.json` - Contains the project metadata and dependencies.\n\n![HeroSection](https://github.com/ayushsgithub/viewai_task/blob/main/public/heroSection.png?raw=true)\n![TableSection](https://github.com/ayushsgithub/viewai_task/blob/main/public/tableSection.png?raw=true)\n\n## Learn More\n\nTo learn more about Next.js, take a look at the following resources:\n\n- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.\n- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.\n\nYou can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!\n\n## Deploy on Vercel\n\nThe easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template\u0026filter=next.js\u0026utm_source=create-next-app\u0026utm_campaign=create-next-app-readme) from the creators of Next.js.\n\nCheck out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fayushsgithub%2Fviewai_task","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fayushsgithub%2Fviewai_task","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fayushsgithub%2Fviewai_task/lists"}