diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 00000000..30cf57ed --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,10 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Editor-based HTTP Client requests +/httpRequests/ +# Ignored default folder with query files +/queries/ +# Datasource local storage ignored files +/dataSources/ +/dataSources.local.xml diff --git a/.idea/codebility-assessment.iml b/.idea/codebility-assessment.iml new file mode 100644 index 00000000..d6ebd480 --- /dev/null +++ b/.idea/codebility-assessment.iml @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml new file mode 100644 index 00000000..03d9549e --- /dev/null +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -0,0 +1,6 @@ + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml new file mode 100644 index 00000000..3653b1f2 --- /dev/null +++ b/.idea/misc.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 00000000..027c1753 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 00000000..83067447 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/backend/README-1-2-YEARS.md b/backend/README-1-2-YEARS.md deleted file mode 100644 index 23c45f56..00000000 --- a/backend/README-1-2-YEARS.md +++ /dev/null @@ -1,96 +0,0 @@ -# Backend Assessment (1–2 Years Experience) - -## Overview - -Welcome to the **1–2 Years** backend assessment! Your task is to create a simple REST API with a few endpoints. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a simple API with CRUD operations for a todo list -2. Store data in memory (no database required) -3. Implement basic error handling - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/backend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/1-2-years-backend -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create a simple API with these endpoints: - - - `GET /api/todos` - List all todos - - `GET /api/todos/:id` - Get a single todo - - `POST /api/todos` - Create a new todo - - `PUT /api/todos/:id` - Update a todo - - `DELETE /api/todos/:id` - Delete a todo - -2. Each todo should have: - - - id - - title - - completed (boolean) - - createdAt - -3. Add basic validation and error handling - -### 5. Test Your Work - -1. Test your API using tools like Postman, Insomnia, or curl -2. Make sure all endpoints work as expected - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement todo API" - git push origin firstname-lastname/1-2-years-backend - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Add a title and brief description of your implementation - -## What We're Looking For - -- Clean, readable code -- Proper API design -- Basic error handling -- Simple project organization - -## Technology Choices - -- Use Node.js -- Feel free to use Express, Fastify, Koa, or any framework you prefer -- Use JavaScript or TypeScript (your choice) -- Choose any libraries you're comfortable with - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -This assessment is intentionally simple. We're looking for clean code and good API design principles. - -**Good luck!** diff --git a/backend/README-3-5-YEARS.md b/backend/README-3-5-YEARS.md deleted file mode 100644 index f8995962..00000000 --- a/backend/README-3-5-YEARS.md +++ /dev/null @@ -1,101 +0,0 @@ -# Backend Assessment (3–5 Years Experience) - -## Overview - -Welcome to the **3–5 Years** backend assessment! Your task is to build a small API with authentication and an external API integration. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create an API with user authentication -2. Implement protected and public routes -3. Integrate with an external API - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/backend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/3-5-years-backend -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create an API with: - - - User authentication (login/register) - - Public endpoints - - Protected endpoints (requiring authentication) - -2. Implement these endpoints: - - - `POST /api/auth/register` - User registration - - `POST /api/auth/login` - User login - - `GET /api/weather` - Get weather data (protected route) - - Any additional endpoints you think are necessary - -3. Integrate with a weather API of your choice: - - - Fetch weather data based on city or coordinates - - Return it to the client through your API - -4. Add basic error handling and input validation - -### 5. Test Your Work - -1. Test your API using tools like Postman, Insomnia, or curl -2. Make sure authentication and API integration work properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement API with authentication and weather integration" - git push origin firstname-lastname/3-5-years-backend - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Add a title and brief description of your implementation - -## What We're Looking For - -- Proper authentication implementation -- Clean code organization -- Error handling -- External API integration -- Input validation - -## Technology Choices - -- Use Node.js -- Choose any framework (Express, NestJS, Fastify, etc.) -- Use JavaScript or TypeScript (your choice) -- Choose any libraries for authentication, validation, etc. -- Store data in memory or use a simple database solution - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on clean implementation rather than feature completeness. We want to see your approach to structuring an API with authentication. - -**Good luck!** diff --git a/backend/README-5-YEARS-Plus.md b/backend/README-5-YEARS-Plus.md deleted file mode 100644 index 23c64d11..00000000 --- a/backend/README-5-YEARS-Plus.md +++ /dev/null @@ -1,101 +0,0 @@ -# Backend Assessment (5+ Years Experience) - -## Overview - -Welcome to the **Senior** backend assessment! Your task is to design a small API that demonstrates your architecture skills and knowledge of backend patterns. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a small API with clean architecture -2. Implement authentication and authorization -3. Integrate with an external service -4. Demonstrate error handling and logging - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/backend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/5-years-plus-backend -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create an API with these core features: - - - User authentication (JWT or similar) - - Role-based access control (admin/user roles) - - Integration with an external API (weather, finance, etc.) - - Proper error handling and logging - -2. Focus on these architectural aspects: - - - Clean separation of concerns - - Service/repository pattern - - Middleware for authentication/authorization - - Centralized error handling - -3. Include a simple README explaining: - - Your architecture decisions - - How to run the application - - Any shortcuts taken due to time constraints - -### 5. Test Your Work - -1. Test your API using tools like Postman, Insomnia, or curl -2. Ensure authentication, authorization, and API integration work properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement API with clean architecture" - git push origin firstname-lastname/5-years-plus-backend - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include details about your architecture and implementation decisions - -## What We're Looking For - -- Clean architecture and code organization -- Proper authentication and authorization -- Error handling and logging -- External service integration -- Code quality and maintainability - -## Technology Choices - -- Use Node.js -- Choose any framework you're comfortable with -- Use JavaScript or TypeScript (preferably TypeScript) -- Select any libraries that fit your architecture -- Choose any database approach (or mock it if time is limited) - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on demonstrating your architectural thinking rather than implementing many features. Quality over quantity is key. - -**Good luck!** diff --git a/backend/package-lock.json b/backend/package-lock.json new file mode 100644 index 00000000..e69de29b diff --git a/backend/package.json b/backend/package.json index c85981fa..bbd6400a 100644 --- a/backend/package.json +++ b/backend/package.json @@ -5,6 +5,12 @@ "start": "node index.js" }, "dependencies": { - "express": "^4.18.2" - } + "express": "^4.22.2" + }, + "description": "", + "main": "index.js", + "keywords": [], + "author": "", + "license": "ISC", + "type": "commonjs" } diff --git a/backend/server.js b/backend/server.js new file mode 100644 index 00000000..05a06804 --- /dev/null +++ b/backend/server.js @@ -0,0 +1,6 @@ +const app = require("./src/app"); +const PORT = 3000; + +app.listen(PORT, () => { + console.log(`Server running on http://localhost:${PORT}`); +}) \ No newline at end of file diff --git a/backend/src/app.js b/backend/src/app.js new file mode 100644 index 00000000..90bb91e3 --- /dev/null +++ b/backend/src/app.js @@ -0,0 +1,11 @@ +const express = require("express"); +const todoRoutes = require("./routes/todo.routes"); + +const app = express(); + +app.use(express.json()); + +app.use("/api/todos", todoRoutes); + +module.exports = app; + diff --git a/backend/src/controllers/todo.controllers.js b/backend/src/controllers/todo.controllers.js new file mode 100644 index 00000000..8b31a0fe --- /dev/null +++ b/backend/src/controllers/todo.controllers.js @@ -0,0 +1,82 @@ +const todos = require("../data/todos"); + +// Get all todos +const getAllTodos = (request, response) => { + response.json(todos); +} + +// GET specific todo +const getTodoById = (request, response) => { + const todo = todos.find(t=> t.id === request.params.id); + + if (!todo){ + return response.status(404).json({ message: "Todo not found"}); + } + response.json(todo); +}; + +// CREATE todo +const createTodo = (request, response) => { + const { title } = request.body; + + if (!title){ + return response.status(400).json({ message: "Title is required"}); + } + + const newTodo = { + id: Date.now().toString(), + title, + completed: false, + createdAt: new Date().toISOString() + } + + todos.push(newTodo); + response.status(201).json(newTodo); +}; + +// UPDATE todo +const updateTodo = (request, response) =>{ + const todo = todos.find(t => t.id === request.params.id); + + if (!todo){ + return response.status(404).json({ message: "Todo not found"}); + } + + const {title, completed} = request.body; + + if (title !== undefined){ + todo.title = title; + } + + if (completed !== undefined){ + todo.completed = completed; + } + + response.json(todo) +}; + +// DELETE todo +const deleteTodo = (request, response) => { + const index = todos.findIndex(t => t.id === request.params.id); + + if (index === -1){ + return response.status(404).json({ message: "Todo not found"}); + } + + const deleted = todos.splice(index,1); + + response.json(deleted[0]); +}; + +module.exports = { + getAllTodos, + getTodoById, + createTodo, + updateTodo, + deleteTodo +} + + + + + diff --git a/backend/src/data/todos.js b/backend/src/data/todos.js new file mode 100644 index 00000000..8a20f991 --- /dev/null +++ b/backend/src/data/todos.js @@ -0,0 +1,3 @@ +let todos = []; + +module.exports = todos; \ No newline at end of file diff --git a/backend/src/routes/todo.routes.js b/backend/src/routes/todo.routes.js new file mode 100644 index 00000000..09825a33 --- /dev/null +++ b/backend/src/routes/todo.routes.js @@ -0,0 +1,19 @@ +const express = require("express"); +const router = express.Router(); + +const { + getAllTodos, + getTodoById, + createTodo, + updateTodo, + deleteTodo +} = require("../controllers/todo.controllers") + +router.get("/", getAllTodos); +router.get("/:id", getTodoById); +router.post("/", createTodo); +router.put("/:id", updateTodo); +router.delete("/:id", deleteTodo); + + +module.exports = router; \ No newline at end of file diff --git a/frontend/.gitignore b/frontend/.gitignore deleted file mode 100644 index 5ef6a520..00000000 --- a/frontend/.gitignore +++ /dev/null @@ -1,41 +0,0 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/.pnp -.pnp.* -.yarn/* -!.yarn/patches -!.yarn/plugins -!.yarn/releases -!.yarn/versions - -# testing -/coverage - -# next.js -/.next/ -/out/ - -# production -/build - -# misc -.DS_Store -*.pem - -# debug -npm-debug.log* -yarn-debug.log* -yarn-error.log* -.pnpm-debug.log* - -# env files (can opt-in for committing if needed) -.env* - -# vercel -.vercel - -# typescript -*.tsbuildinfo -next-env.d.ts diff --git a/frontend/README-1-2-YEARS.md b/frontend/README-1-2-YEARS.md deleted file mode 100644 index bc7ad190..00000000 --- a/frontend/README-1-2-YEARS.md +++ /dev/null @@ -1,80 +0,0 @@ -# Frontend Assessment (1–2 Years Experience) - -## Overview - -Welcome to the **1–2 Years** frontend assessment! Your task is to implement a simple landing page based on the design of [Moola.com](https://www.moola.com/). This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Implement a landing page similar to [Moola.com](https://www.moola.com/) -2. Focus on the hero section and one additional section of your choice -3. Make it responsive for desktop and mobile -4. Use Next.js (or React if you prefer) - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/frontend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/frontend -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implement the Design - -1. Look at [Moola.com](https://www.moola.com/) for reference -2. Create a simplified version of the landing page -3. Focus on these key elements: - - Hero section with heading, subheading and call-to-action - - One additional section of your choice - - Responsive layout for desktop and mobile - -### 5. Test Your Work - -1. Make sure your page looks good on different screen sizes -2. Check for any obvious errors - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement landing page design" - git push origin firstname-lastname/frontend - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Add a title and brief description of your implementation - -## What We're Looking For - -- Clean, readable code -- Basic responsive design -- Attention to visual details -- Simple component structure - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -This assessment is intentionally simple and focused. We're looking for quality over quantity, so don't feel pressured to implement every section of the website. - -**Good luck!** diff --git a/frontend/README-3-5-YEARS.md b/frontend/README-3-5-YEARS.md deleted file mode 100644 index db3e3556..00000000 --- a/frontend/README-3-5-YEARS.md +++ /dev/null @@ -1,95 +0,0 @@ -# Frontend Assessment (3–5 Years Experience) - -## Overview - -Welcome to the **3–5 Years** frontend assessment! Your task is to build a simple product listing page with data fetching. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a page that fetches and displays products from a public API -2. Implement a simple detail view when a product is clicked -3. Add basic filtering or search functionality -4. Make it responsive - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/frontend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/3-5-years-frontend -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create a product listing page that: - - - Fetches data from any public API (suggestion: [Fake Store API](https://fakestoreapi.com/)) - - Displays products in a grid or list - - Shows basic product information (image, name, price) - -2. Add a simple detail view: - - - When a product is clicked, show more details - - This can be a new page or a modal - -3. Implement basic functionality: - - Add simple filtering or search functionality - - Handle loading and error states - -### 5. Test Your Work - -1. Make sure your application works on different screen sizes -2. Check that your data fetching and interactions work properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement product listing page" - git push origin firstname-lastname/3-5-years-frontend - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Add a title and brief description of your implementation - -## What We're Looking For - -- Clean, readable code -- Proper data fetching approach -- Basic state management -- Responsive design -- Error handling - -## Technology Choices - -- You can use Next.js or React -- Feel free to use any styling approach (CSS, Tailwind, styled-components, etc.) -- Choose any state management solution you're comfortable with - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on quality over quantity. A clean, simple implementation is better than a complex one with bugs. - -**Good luck!** diff --git a/frontend/README-5-YEARS-Plus.md b/frontend/README-5-YEARS-Plus.md deleted file mode 100644 index 89b6da83..00000000 --- a/frontend/README-5-YEARS-Plus.md +++ /dev/null @@ -1,100 +0,0 @@ -# Frontend Assessment (5+ Years Experience) - -## Overview - -Welcome to the **Senior** frontend assessment! Your task is to create a small dashboard that demonstrates your architecture decisions and React knowledge. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a small dashboard with two main components: - - Weather widget using a weather API - - Financial widget showing stock or cryptocurrency data -2. Focus on architecture and component design -3. Implement proper data fetching and error handling - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/frontend -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/5-years-plus -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create a dashboard with: - - - A weather widget using any weather API - - A financial widget using any stock/crypto API - - A clean, simple layout - -2. Focus on these technical aspects: - - - Clean component architecture - - Proper data fetching with loading/error states - - Basic caching or state management - - Simple responsive design - -3. Data Sources (suggestions): - - Weather: [OpenWeatherMap](https://openweathermap.org/api) or any similar API - - Financial: [Finnhub](https://finnhub.io/) or any similar API - - Feel free to use mock data if API access is problematic - -### 5. Test Your Work - -1. Make sure your application works on different screen sizes -2. Check that your error handling works properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement dashboard with weather and financial widgets" - git push origin firstname-lastname/5-years-plus - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include a brief explanation of your architecture decisions - -## What We're Looking For - -- Clean architecture and code organization -- Proper component design and separation of concerns -- Effective data fetching and state management -- Error and edge case handling -- Clean, maintainable code - -## Technology Choices - -- Use Next.js or React -- Choose any libraries or tools you're comfortable with -- Feel free to use any styling approach -- Select any state management solution that fits the task - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on quality over quantity. We're more interested in seeing your architectural approach and code quality than a large number of features. - -**Good luck!** diff --git a/frontend/README.md b/frontend/README.md deleted file mode 100644 index e215bc4c..00000000 --- a/frontend/README.md +++ /dev/null @@ -1,36 +0,0 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. diff --git a/frontend/eslint.config.mjs b/frontend/eslint.config.mjs deleted file mode 100644 index c85fb67c..00000000 --- a/frontend/eslint.config.mjs +++ /dev/null @@ -1,16 +0,0 @@ -import { dirname } from "path"; -import { fileURLToPath } from "url"; -import { FlatCompat } from "@eslint/eslintrc"; - -const __filename = fileURLToPath(import.meta.url); -const __dirname = dirname(__filename); - -const compat = new FlatCompat({ - baseDirectory: __dirname, -}); - -const eslintConfig = [ - ...compat.extends("next/core-web-vitals", "next/typescript"), -]; - -export default eslintConfig; diff --git a/frontend/next.config.ts b/frontend/next.config.ts deleted file mode 100644 index e9ffa308..00000000 --- a/frontend/next.config.ts +++ /dev/null @@ -1,7 +0,0 @@ -import type { NextConfig } from "next"; - -const nextConfig: NextConfig = { - /* config options here */ -}; - -export default nextConfig; diff --git a/frontend/package.json b/frontend/package.json deleted file mode 100644 index 72b917d9..00000000 --- a/frontend/package.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "name": "frontend", - "version": "0.1.0", - "private": true, - "scripts": { - "dev": "next dev", - "build": "next build", - "start": "next start", - "lint": "next lint" - }, - "dependencies": { - "react": "^19.0.0", - "react-dom": "^19.0.0", - "next": "15.2.4" - }, - "devDependencies": { - "typescript": "^5", - "@types/node": "^20", - "@types/react": "^19", - "@types/react-dom": "^19", - "@tailwindcss/postcss": "^4", - "tailwindcss": "^4", - "eslint": "^9", - "eslint-config-next": "15.2.4", - "@eslint/eslintrc": "^3" - } -} diff --git a/frontend/postcss.config.mjs b/frontend/postcss.config.mjs deleted file mode 100644 index c7bcb4b1..00000000 --- a/frontend/postcss.config.mjs +++ /dev/null @@ -1,5 +0,0 @@ -const config = { - plugins: ["@tailwindcss/postcss"], -}; - -export default config; diff --git a/frontend/public/file.svg b/frontend/public/file.svg deleted file mode 100644 index 004145cd..00000000 --- a/frontend/public/file.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/public/globe.svg b/frontend/public/globe.svg deleted file mode 100644 index 567f17b0..00000000 --- a/frontend/public/globe.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/public/next.svg b/frontend/public/next.svg deleted file mode 100644 index 5174b28c..00000000 --- a/frontend/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/public/vercel.svg b/frontend/public/vercel.svg deleted file mode 100644 index 77053960..00000000 --- a/frontend/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/public/window.svg b/frontend/public/window.svg deleted file mode 100644 index b2b2a44f..00000000 --- a/frontend/public/window.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/src/app/favicon.ico b/frontend/src/app/favicon.ico deleted file mode 100644 index 718d6fea..00000000 Binary files a/frontend/src/app/favicon.ico and /dev/null differ diff --git a/frontend/src/app/globals.css b/frontend/src/app/globals.css deleted file mode 100644 index a2dc41ec..00000000 --- a/frontend/src/app/globals.css +++ /dev/null @@ -1,26 +0,0 @@ -@import "tailwindcss"; - -:root { - --background: #ffffff; - --foreground: #171717; -} - -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); -} - -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } -} - -body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; -} diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx deleted file mode 100644 index f7fa87eb..00000000 --- a/frontend/src/app/layout.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; -import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); - -export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", -}; - -export default function RootLayout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { - return ( - - - {children} - - - ); -} diff --git a/frontend/src/app/page.tsx b/frontend/src/app/page.tsx deleted file mode 100644 index e68abe6b..00000000 --- a/frontend/src/app/page.tsx +++ /dev/null @@ -1,103 +0,0 @@ -import Image from "next/image"; - -export default function Home() { - return ( -
-
- Next.js logo -
    -
  1. - Get started by editing{" "} - - src/app/page.tsx - - . -
    2. -
  2. - Save and see your changes instantly. -
    3. -
- -
- - Vercel logomark - Deploy now - - - Read our docs - -
-
- -
- ); -} diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json deleted file mode 100644 index c1334095..00000000 --- a/frontend/tsconfig.json +++ /dev/null @@ -1,27 +0,0 @@ -{ - "compilerOptions": { - "target": "ES2017", - "lib": ["dom", "dom.iterable", "esnext"], - "allowJs": true, - "skipLibCheck": true, - "strict": true, - "noEmit": true, - "esModuleInterop": true, - "module": "esnext", - "moduleResolution": "bundler", - "resolveJsonModule": true, - "isolatedModules": true, - "jsx": "preserve", - "incremental": true, - "plugins": [ - { - "name": "next" - } - ], - "paths": { - "@/*": ["./src/*"] - } - }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], - "exclude": ["node_modules"] -} diff --git a/fullstack/README-1-2-YEARS.md b/fullstack/README-1-2-YEARS.md deleted file mode 100644 index 3153a970..00000000 --- a/fullstack/README-1-2-YEARS.md +++ /dev/null @@ -1,145 +0,0 @@ -# Fullstack Assessment (1-2 Years Experience) - -## Overview - -Welcome to the **1-2 Years** fullstack assessment! Your task is to create a simple blog application using Next.js. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a simple blog with Next.js -2. Implement a page that lists blog posts -3. Add a page that displays a single blog post -4. Create a simple API route to serve the blog data -5. Style the application with basic CSS or Tailwind - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/fullstack-1-2 -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Setup the Project - -1. Create a new Next.js project in the `fullstack` directory: - - ```bash - mkdir -p fullstack - cd fullstack - npx create-next-app@latest . - ``` - -2. Choose your preferred options during the setup (TypeScript is recommended but optional) - -### 5. Implementation - -#### Blog Data - -Create a simple data file with blog posts: - -```javascript -// data/posts.js -export const posts = [ - { - id: 1, - title: "Getting Started with Next.js", - excerpt: "Learn the basics of Next.js and how to create your first app", - content: - "Next.js is a React framework that enables server-side rendering and generating static websites...", - date: "2025-04-15", - }, - { - id: 2, - title: "Styling in Next.js", - excerpt: "Different ways to style your Next.js application", - content: - "There are multiple ways to style your Next.js application including CSS modules, Tailwind CSS...", - date: "2025-04-16", - }, - // Add 1-2 more posts -]; -``` - -#### Pages to Implement - -1. **Home Page** (`app/page.jsx` or `pages/index.jsx`): - - - Display a list of blog posts with titles and excerpts - - Add links to individual blog post pages - - Include basic styling - -2. **Blog Post Page** (`app/posts/[id]/page.jsx` or `pages/posts/[id].jsx`): - - - Display a single blog post with full content - - Include a back button to return to the home page - - Style the page appropriately - -3. **API Route** (`app/api/posts/route.js` or `pages/api/posts.js`): - - Create an endpoint that returns all posts - - Add another endpoint to get a specific post by ID - -### 6. Test Your Application - -1. Run your Next.js app: - ```bash - npm run dev - ``` -2. Test the blog post list page -3. Test the individual blog post pages -4. Test the API endpoints (e.g., `/api/posts` and `/api/posts/1`) - -### 7. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement simple blog with Next.js" - git push origin firstname-lastname/fullstack-1-2 - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include screenshots of your implementation - - Add a brief description of your approach - -## What We're Looking For - -- Understanding of Next.js basics -- Proper page routing and navigation -- Basic API route implementation -- Clean code organization -- Simple, effective styling - -## Technology Choices - -- Next.js (App Router or Pages Router - your choice) -- JavaScript or TypeScript (your preference) -- CSS, Tailwind, or any styling solution you prefer -- No database required (use the provided data array) - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -This assessment is intentionally simple. We're looking for clean code and a basic understanding of fullstack Next.js development. - -**Good luck!** diff --git a/fullstack/README-3-5-YEARS.md b/fullstack/README-3-5-YEARS.md deleted file mode 100644 index 6972974e..00000000 --- a/fullstack/README-3-5-YEARS.md +++ /dev/null @@ -1,143 +0,0 @@ -# Fullstack Assessment (3-5 Years Experience) - -## Overview - -Welcome to the **3-5 Years** fullstack assessment! Your task is to create a simple todo application with Next.js, including data persistence and authentication. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a todo application with Next.js -2. Implement user authentication (can be simplified) -3. Create API routes for CRUD operations -4. Add data persistence with a database or local storage -5. Style the application for a clean user experience - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/fullstack-3-5 -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Setup the Project - -1. Create a new Next.js project in the `fullstack` directory: - - ```bash - mkdir -p fullstack - cd fullstack - npx create-next-app@latest . - ``` - -2. Choose your preferred options during the setup (TypeScript is recommended) - -3. Install additional dependencies as needed: - ```bash - # Example - choose what you need - npm install next-auth prisma @prisma/client - # Or simpler alternatives if you prefer - ``` - -### 5. Implementation - -#### Authentication - -Implement a simple authentication system: - -- You can use NextAuth.js, a custom solution, or even mock authentication -- Create sign-in and sign-out functionality -- Protect the todo list page from unauthenticated users - -#### Todo Application - -1. **Todo List Page**: - - - Display the current user's todos - - Show each todo's title, status (complete/incomplete), and creation date - - Add buttons to mark todos as complete or delete them - - Include a form to create new todos - -2. **API Routes**: - - - Create an endpoint for fetching todos - - Add endpoints for creating, updating, and deleting todos - - Ensure routes are protected for authenticated users only - -3. **Data Persistence**: - - - Use any database you're comfortable with (Prisma + SQLite is a simple option) - - Or use localStorage/JSON files if you prefer a simpler approach - - Ensure data persists between page refreshes - -4. **Styling**: - - Create a clean, user-friendly interface - - Add loading and error states - - Make the UI responsive - -### 6. Test Your Application - -1. Run your Next.js app: - ```bash - npm run dev - ``` -2. Test the authentication flow -3. Test all todo operations (create, read, update, delete) -4. Verify data persistence - -### 7. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement todo application with authentication" - git push origin firstname-lastname/fullstack-3-5 - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include screenshots of your implementation - - Add a brief description of your approach and any trade-offs you made - -## What We're Looking For - -- Clean, well-organized code -- Proper authentication implementation -- Effective API route design -- Data persistence approach -- User experience and UI design -- Error handling - -## Technology Choices - -- Next.js (App Router or Pages Router - your choice) -- TypeScript preferred but JavaScript is acceptable -- Any authentication library (NextAuth.js, custom JWT, etc.) -- Any database solution or local storage approach -- Any styling approach you prefer - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on implementing a clean, working solution rather than adding many features. We're looking for quality code over quantity of features. - -**Good luck!** diff --git a/fullstack/README-5-YEARS-Plus.md b/fullstack/README-5-YEARS-Plus.md deleted file mode 100644 index a59689df..00000000 --- a/fullstack/README-5-YEARS-Plus.md +++ /dev/null @@ -1,145 +0,0 @@ -# Fullstack Assessment (5+ Years Experience) - -## Overview - -Welcome to the **Senior** fullstack assessment! Your task is to create a small e-commerce product page with Next.js, focusing on architecture, performance, and user experience. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a product detail page with Next.js -2. Implement server and client components appropriately -3. Add a shopping cart with state management -4. Create API routes for product data and cart operations -5. Focus on performance, architecture, and code quality - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/fullstack-5-plus -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Setup the Project - -1. Create a new Next.js project in the `fullstack` directory: - - ```bash - mkdir -p fullstack - cd fullstack - npx create-next-app@latest . - ``` - -2. Choose the following options: - - TypeScript - - ESLint - - Tailwind CSS (or your preferred styling solution) - - App Router - -### 5. Implementation - -#### Product Detail Page - -Create a product detail page that demonstrates: - -- Server components for initial data loading -- Client components for interactive elements -- Proper loading and error states -- Optimized images -- Performance considerations - -#### Shopping Cart - -Implement a cart system that: - -- Allows adding products to the cart -- Shows cart summary (number of items, total price) -- Persists cart state (localStorage, cookies, or server-side) -- Uses appropriate state management - -#### Data Handling - -1. **Product Data**: - - - Create mock product data or use a simple API - - Implement proper data fetching with caching - - Handle loading and error states - -2. **API Routes**: - - - Create endpoints for product data - - Implement cart operations (add, remove, update) - - Add proper error handling - -3. **Architecture**: - - Organize code with clear separation of concerns - - Use appropriate patterns for state management - - Create reusable components - -### 6. Test Your Application - -1. Run your Next.js app: - ```bash - npm run dev - ``` -2. Test the product detail page -3. Verify cart functionality -4. Check performance using browser dev tools - -### 7. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement product page with cart functionality" - git push origin firstname-lastname/fullstack-5-plus - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include screenshots of your implementation - - Add a detailed explanation of your architecture decisions, performance optimizations, and any trade-offs - -## What We're Looking For - -- Clean architecture and component design -- Proper use of server and client components -- Effective state management -- Performance optimization -- Error handling and edge cases -- Code quality and organization -- UX considerations - -## Technology Choices - -- Next.js with App Router -- TypeScript -- Any state management solution you prefer -- Any styling approach (Tailwind recommended) -- Any data fetching library if needed - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on demonstrating your architectural thinking and attention to performance rather than implementing many features. Quality over quantity is key. - -**Good luck!** diff --git a/mobile/.gitignore b/mobile/.gitignore deleted file mode 100644 index c9d575d7..00000000 --- a/mobile/.gitignore +++ /dev/null @@ -1,38 +0,0 @@ -# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files - -# dependencies -node_modules/ - -# Expo -.expo/ -dist/ -web-build/ -expo-env.d.ts - -# Native -*.orig.* -*.jks -*.p8 -*.p12 -*.key -*.mobileprovision - -# Metro -.metro-health-check* - -# debug -npm-debug.* -yarn-debug.* -yarn-error.* - -# macOS -.DS_Store -*.pem - -# local env files -.env*.local - -# typescript -*.tsbuildinfo - -app-example diff --git a/mobile/README-1-2-YEARS.md b/mobile/README-1-2-YEARS.md deleted file mode 100644 index 91d2dea5..00000000 --- a/mobile/README-1-2-YEARS.md +++ /dev/null @@ -1,95 +0,0 @@ -# Mobile Assessment (1-2 Years Experience) - -## Overview - -Welcome to the **1-2 Years** mobile development assessment! Your task is to implement a simple UI screen based on a design mockup. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a single screen based on the provided design mockup -2. Implement basic styling and layout -3. Add simple button interaction - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/mobile -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/1-2-years-mobile -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Look at the design mockup in the `image-test` folder -2. Create a screen that matches this design: - - - Implement the layout structure - - Match colors and typography - - Create buttons with press states - -3. Keep it simple: - - Focus on visual accuracy - - Make sure buttons respond to touches - - Ensure the screen looks good on different device sizes - -### 5. Test Your Work - -1. Run the application using Expo: - ```bash - npm start - ``` -2. Test on iOS/Android simulator or your physical device -3. Check that the layout matches the design mockup - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement UI screen based on design mockup" - git push origin firstname-lastname/1-2-years-mobile - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include a screenshot of your implementation - - Add a brief description of your approach - -## What We're Looking For - -- Visual accuracy compared to the mockup -- Clean, readable code -- Proper use of React Native components -- Basic responsiveness - -## Technology Choices - -- Use the existing Expo setup -- Feel free to use StyleSheet or any styling approach you prefer -- Choose any additional libraries if needed - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -This assessment is intentionally simple. We're looking for clean code and attention to visual details rather than complex functionality. - -**Good luck!** diff --git a/mobile/README-3-5-YEARS.md b/mobile/README-3-5-YEARS.md deleted file mode 100644 index 20463803..00000000 --- a/mobile/README-3-5-YEARS.md +++ /dev/null @@ -1,105 +0,0 @@ -# Mobile Assessment (3-5 Years Experience) - -## Overview - -Welcome to the **3-5 Years** mobile development assessment! Your task is to build a simple product details screen with data fetching. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a product details screen that fetches data from an API -2. Display product information with a simple image, title, price, and description -3. Implement a basic "Add to Cart" functionality -4. Handle loading and error states - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/mobile -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/3-5-years-mobile -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create a product details screen that: - - - Fetches data from [Fake Store API](https://fakestoreapi.com/products/1) (or any similar API) - - Displays the product image, title, price, and description - - Shows a loading state while fetching data - - Handles potential errors gracefully - -2. Add a simple "Add to Cart" button that: - - - Shows a visual confirmation when pressed - - Stores the selected product in local state - - Updates a cart counter somewhere on the screen - -3. Focus on these technical aspects: - - Clean component structure - - Proper data fetching - - Basic state management - - Simple UI/UX considerations - -### 5. Test Your Work - -1. Run the application using Expo: - ```bash - npm start - ``` -2. Test on iOS/Android simulator or your physical device -3. Verify that data fetching, display, and cart functionality work properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement product details screen with API integration" - git push origin firstname-lastname/3-5-years-mobile - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include screenshots of your implementation - - Add a brief explanation of your approach - -## What We're Looking For - -- Clean component architecture -- Proper data fetching with loading/error states -- Basic state management -- Attention to UI details -- Code organization and readability - -## Technology Choices - -- Use the existing Expo setup -- Choose any state management approach -- Select any libraries for fetching data -- Use any UI components or styling approach you prefer - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on quality over quantity. A clean, working implementation of these basic features is better than an ambitious but incomplete or buggy solution. - -**Good luck!** diff --git a/mobile/README-5-YEARS-Plus.md b/mobile/README-5-YEARS-Plus.md deleted file mode 100644 index a35f0bce..00000000 --- a/mobile/README-5-YEARS-Plus.md +++ /dev/null @@ -1,102 +0,0 @@ -# Mobile Assessment (5+ Years Experience) - -## Overview - -Welcome to the **Senior** mobile development assessment! Your task is to create a small food app feature that demonstrates your architecture decisions and React Native knowledge. This assessment is designed to take **1-2 hours** of coding time, but you have **1-2 days** to complete it. - -## Task Summary - -1. Create a restaurant details screen with menu items -2. Implement a cart feature for adding items -3. Focus on architecture and component design -4. Use mock data (no API integration required) - -## Steps to Complete - -### 1. Fork the Repository - -1. Go to [https://github.com/Zeff01/codebility-assessment](https://github.com/Zeff01/codebility-assessment) -2. Click the "Fork" button in the upper right corner - -### 2. Clone Your Fork - -```bash -git clone https://github.com/YOUR-USERNAME/codebility-assessment.git -cd codebility-assessment/mobile -``` - -### 3. Create a Branch - -```bash -git checkout -b firstname-lastname/5-years-plus-mobile -``` - -Replace `firstname-lastname` with your actual name. - -### 4. Implementation - -1. Create a restaurant details screen that: - - - Shows restaurant information (name, cuisine type, rating) - - Displays a list of menu items with prices - - Allows adding items to a cart - - Updates a cart icon/count when items are added - -2. Focus on these architectural aspects: - - - Clean component structure - - State management approach - - Separation of concerns - - Code organization - -3. Include mock data directly in your code (no need for API calls) - -### 5. Test Your Work - -1. Run the application using Expo: - ```bash - npm start - ``` -2. Test on iOS/Android simulator or your physical device -3. Verify that the restaurant details and cart functionality work properly - -### 6. Submit Your Work - -1. Commit and push your changes: - - ```bash - git add . - git commit -m "Implement restaurant details with cart functionality" - git push origin firstname-lastname/5-years-plus-mobile - ``` - -2. Create a Pull Request: - - Go to your fork on GitHub - - Click "Contribute" and "Open pull request" - - Make sure the base repository is set to `Zeff01/codebility-assessment` - - Include screenshots of your implementation - - Add a brief explanation of your architecture decisions - -## What We're Looking For - -- Clean architecture and code organization -- Proper component design and separation of concerns -- Effective state management approach -- Attention to UX details -- Code quality and maintainability - -## Technology Choices - -- Use the existing Expo setup -- Choose any state management approach -- Select any UI components or styling libraries -- Use any navigation solution you prefer - -## Time Allowance - -- **Expected coding time**: 1-2 hours -- **Submission deadline**: 1-2 days - -Focus on demonstrating your architectural thinking rather than implementing many features. Quality over quantity is key. - -**Good luck!** diff --git a/mobile/README.md b/mobile/README.md deleted file mode 100644 index cd4feb8a..00000000 --- a/mobile/README.md +++ /dev/null @@ -1,50 +0,0 @@ -# Welcome to your Expo app 👋 - -This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app). - -## Get started - -1. Install dependencies - - ```bash - npm install - ``` - -2. Start the app - - ```bash - npx expo start - ``` - -In the output, you'll find options to open the app in a - -- [development build](https://docs.expo.dev/develop/development-builds/introduction/) -- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/) -- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/) -- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo - -You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction). - -## Get a fresh project - -When you're ready, run: - -```bash -npm run reset-project -``` - -This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing. - -## Learn more - -To learn more about developing your project with Expo, look at the following resources: - -- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides). -- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web. - -## Join the community - -Join our community of developers creating universal apps. - -- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute. -- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions. diff --git a/mobile/app.json b/mobile/app.json deleted file mode 100644 index aae24b9c..00000000 --- a/mobile/app.json +++ /dev/null @@ -1,41 +0,0 @@ -{ - "expo": { - "name": "mobile", - "slug": "mobile", - "version": "1.0.0", - "orientation": "portrait", - "icon": "./assets/images/icon.png", - "scheme": "myapp", - "userInterfaceStyle": "automatic", - "newArchEnabled": true, - "ios": { - "supportsTablet": true - }, - "android": { - "adaptiveIcon": { - "foregroundImage": "./assets/images/adaptive-icon.png", - "backgroundColor": "#ffffff" - } - }, - "web": { - "bundler": "metro", - "output": "static", - "favicon": "./assets/images/favicon.png" - }, - "plugins": [ - "expo-router", - [ - "expo-splash-screen", - { - "image": "./assets/images/splash-icon.png", - "imageWidth": 200, - "resizeMode": "contain", - "backgroundColor": "#ffffff" - } - ] - ], - "experiments": { - "typedRoutes": true - } - } -} diff --git a/mobile/app/(tabs)/_layout.tsx b/mobile/app/(tabs)/_layout.tsx deleted file mode 100644 index cfbc1e23..00000000 --- a/mobile/app/(tabs)/_layout.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { Tabs } from 'expo-router'; -import React from 'react'; -import { Platform } from 'react-native'; - -import { HapticTab } from '@/components/HapticTab'; -import { IconSymbol } from '@/components/ui/IconSymbol'; -import TabBarBackground from '@/components/ui/TabBarBackground'; -import { Colors } from '@/constants/Colors'; -import { useColorScheme } from '@/hooks/useColorScheme'; - -export default function TabLayout() { - const colorScheme = useColorScheme(); - - return ( - - , - }} - /> - , - }} - /> - - ); -} diff --git a/mobile/app/(tabs)/explore.tsx b/mobile/app/(tabs)/explore.tsx deleted file mode 100644 index 06e70c4f..00000000 --- a/mobile/app/(tabs)/explore.tsx +++ /dev/null @@ -1,109 +0,0 @@ -import { StyleSheet, Image, Platform } from 'react-native'; - -import { Collapsible } from '@/components/Collapsible'; -import { ExternalLink } from '@/components/ExternalLink'; -import ParallaxScrollView from '@/components/ParallaxScrollView'; -import { ThemedText } from '@/components/ThemedText'; -import { ThemedView } from '@/components/ThemedView'; -import { IconSymbol } from '@/components/ui/IconSymbol'; - -export default function TabTwoScreen() { - return ( - - }> - - Explore - - This app includes example code to help you get started. - - - This app has two screens:{' '} - app/(tabs)/index.tsx and{' '} - app/(tabs)/explore.tsx - - - The layout file in app/(tabs)/_layout.tsx{' '} - sets up the tab navigator. - - - Learn more - - - - - You can open this project on Android, iOS, and the web. To open the web version, press{' '} - w in the terminal running this project. - - - - - For static images, you can use the @2x and{' '} - @3x suffixes to provide files for - different screen densities - - - - Learn more - - - - - Open app/_layout.tsx to see how to load{' '} - - custom fonts such as this one. - - - - Learn more - - - - - This template has light and dark mode support. The{' '} - useColorScheme() hook lets you inspect - what the user's current color scheme is, and so you can adjust UI colors accordingly. - - - Learn more - - - - - This template includes an example of an animated component. The{' '} - components/HelloWave.tsx component uses - the powerful react-native-reanimated{' '} - library to create a waving hand animation. - - {Platform.select({ - ios: ( - - The components/ParallaxScrollView.tsx{' '} - component provides a parallax effect for the header image. - - ), - })} - - - ); -} - -const styles = StyleSheet.create({ - headerImage: { - color: '#808080', - bottom: -90, - left: -35, - position: 'absolute', - }, - titleContainer: { - flexDirection: 'row', - gap: 8, - }, -}); diff --git a/mobile/app/(tabs)/index.tsx b/mobile/app/(tabs)/index.tsx deleted file mode 100644 index 886b0796..00000000 --- a/mobile/app/(tabs)/index.tsx +++ /dev/null @@ -1,74 +0,0 @@ -import { Image, StyleSheet, Platform } from 'react-native'; - -import { HelloWave } from '@/components/HelloWave'; -import ParallaxScrollView from '@/components/ParallaxScrollView'; -import { ThemedText } from '@/components/ThemedText'; -import { ThemedView } from '@/components/ThemedView'; - -export default function HomeScreen() { - return ( - - }> - - Welcome! - - - - Step 1: Try it - - Edit app/(tabs)/index.tsx to see changes. - Press{' '} - - {Platform.select({ - ios: 'cmd + d', - android: 'cmd + m', - web: 'F12' - })} - {' '} - to open developer tools. - - - - Step 2: Explore - - Tap the Explore tab to learn more about what's included in this starter app. - - - - Step 3: Get a fresh start - - When you're ready, run{' '} - npm run reset-project to get a fresh{' '} - app directory. This will move the current{' '} - app to{' '} - app-example. - - - - ); -} - -const styles = StyleSheet.create({ - titleContainer: { - flexDirection: 'row', - alignItems: 'center', - gap: 8, - }, - stepContainer: { - gap: 8, - marginBottom: 8, - }, - reactLogo: { - height: 178, - width: 290, - bottom: 0, - left: 0, - position: 'absolute', - }, -}); diff --git a/mobile/app/+not-found.tsx b/mobile/app/+not-found.tsx deleted file mode 100644 index 963b04fb..00000000 --- a/mobile/app/+not-found.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import { Link, Stack } from 'expo-router'; -import { StyleSheet } from 'react-native'; - -import { ThemedText } from '@/components/ThemedText'; -import { ThemedView } from '@/components/ThemedView'; - -export default function NotFoundScreen() { - return ( - <> - - - This screen doesn't exist. - - Go to home screen! - - - - ); -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - alignItems: 'center', - justifyContent: 'center', - padding: 20, - }, - link: { - marginTop: 15, - paddingVertical: 15, - }, -}); diff --git a/mobile/app/_layout.tsx b/mobile/app/_layout.tsx deleted file mode 100644 index db745789..00000000 --- a/mobile/app/_layout.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native'; -import { useFonts } from 'expo-font'; -import { Stack } from 'expo-router'; -import * as SplashScreen from 'expo-splash-screen'; -import { StatusBar } from 'expo-status-bar'; -import { useEffect } from 'react'; -import 'react-native-reanimated'; - -import { useColorScheme } from '@/hooks/useColorScheme'; - -// Prevent the splash screen from auto-hiding before asset loading is complete. -SplashScreen.preventAutoHideAsync(); - -export default function RootLayout() { - const colorScheme = useColorScheme(); - const [loaded] = useFonts({ - SpaceMono: require('../assets/fonts/SpaceMono-Regular.ttf'), - }); - - useEffect(() => { - if (loaded) { - SplashScreen.hideAsync(); - } - }, [loaded]); - - if (!loaded) { - return null; - } - - return ( - - - - - - - - ); -} diff --git a/mobile/assets/fonts/SpaceMono-Regular.ttf b/mobile/assets/fonts/SpaceMono-Regular.ttf deleted file mode 100644 index 28d7ff71..00000000 Binary files a/mobile/assets/fonts/SpaceMono-Regular.ttf and /dev/null differ diff --git a/mobile/assets/images/adaptive-icon.png b/mobile/assets/images/adaptive-icon.png deleted file mode 100644 index 03d6f6b6..00000000 Binary files a/mobile/assets/images/adaptive-icon.png and /dev/null differ diff --git a/mobile/assets/images/favicon.png b/mobile/assets/images/favicon.png deleted file mode 100644 index e75f697b..00000000 Binary files a/mobile/assets/images/favicon.png and /dev/null differ diff --git a/mobile/assets/images/icon.png b/mobile/assets/images/icon.png deleted file mode 100644 index a0b1526f..00000000 Binary files a/mobile/assets/images/icon.png and /dev/null differ diff --git a/mobile/assets/images/partial-react-logo.png b/mobile/assets/images/partial-react-logo.png deleted file mode 100644 index 66fd9570..00000000 Binary files a/mobile/assets/images/partial-react-logo.png and /dev/null differ diff --git a/mobile/assets/images/react-logo.png b/mobile/assets/images/react-logo.png deleted file mode 100644 index 9d72a9ff..00000000 Binary files a/mobile/assets/images/react-logo.png and /dev/null differ diff --git a/mobile/assets/images/react-logo@2x.png b/mobile/assets/images/react-logo@2x.png deleted file mode 100644 index 2229b130..00000000 Binary files a/mobile/assets/images/react-logo@2x.png and /dev/null differ diff --git a/mobile/assets/images/react-logo@3x.png b/mobile/assets/images/react-logo@3x.png deleted file mode 100644 index a99b2032..00000000 Binary files a/mobile/assets/images/react-logo@3x.png and /dev/null differ diff --git a/mobile/assets/images/splash-icon.png b/mobile/assets/images/splash-icon.png deleted file mode 100644 index 03d6f6b6..00000000 Binary files a/mobile/assets/images/splash-icon.png and /dev/null differ diff --git a/mobile/components/Collapsible.tsx b/mobile/components/Collapsible.tsx deleted file mode 100644 index 55bff2f9..00000000 --- a/mobile/components/Collapsible.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { PropsWithChildren, useState } from 'react'; -import { StyleSheet, TouchableOpacity } from 'react-native'; - -import { ThemedText } from '@/components/ThemedText'; -import { ThemedView } from '@/components/ThemedView'; -import { IconSymbol } from '@/components/ui/IconSymbol'; -import { Colors } from '@/constants/Colors'; -import { useColorScheme } from '@/hooks/useColorScheme'; - -export function Collapsible({ children, title }: PropsWithChildren & { title: string }) { - const [isOpen, setIsOpen] = useState(false); - const theme = useColorScheme() ?? 'light'; - - return ( - - setIsOpen((value) => !value)} - activeOpacity={0.8}> - - - {title} - - {isOpen && {children}} - - ); -} - -const styles = StyleSheet.create({ - heading: { - flexDirection: 'row', - alignItems: 'center', - gap: 6, - }, - content: { - marginTop: 6, - marginLeft: 24, - }, -}); diff --git a/mobile/components/ExternalLink.tsx b/mobile/components/ExternalLink.tsx deleted file mode 100644 index 8f05675b..00000000 --- a/mobile/components/ExternalLink.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { Link } from 'expo-router'; -import { openBrowserAsync } from 'expo-web-browser'; -import { type ComponentProps } from 'react'; -import { Platform } from 'react-native'; - -type Props = Omit, 'href'> & { href: string }; - -export function ExternalLink({ href, ...rest }: Props) { - return ( - { - if (Platform.OS !== 'web') { - // Prevent the default behavior of linking to the default browser on native. - event.preventDefault(); - // Open the link in an in-app browser. - await openBrowserAsync(href); - } - }} - /> - ); -} diff --git a/mobile/components/HapticTab.tsx b/mobile/components/HapticTab.tsx deleted file mode 100644 index 7f3981cb..00000000 --- a/mobile/components/HapticTab.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { BottomTabBarButtonProps } from '@react-navigation/bottom-tabs'; -import { PlatformPressable } from '@react-navigation/elements'; -import * as Haptics from 'expo-haptics'; - -export function HapticTab(props: BottomTabBarButtonProps) { - return ( - { - if (process.env.EXPO_OS === 'ios') { - // Add a soft haptic feedback when pressing down on the tabs. - Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light); - } - props.onPressIn?.(ev); - }} - /> - ); -} diff --git a/mobile/components/HelloWave.tsx b/mobile/components/HelloWave.tsx deleted file mode 100644 index 9b4bc31c..00000000 --- a/mobile/components/HelloWave.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import { useEffect } from 'react'; -import { StyleSheet } from 'react-native'; -import Animated, { - useSharedValue, - useAnimatedStyle, - withTiming, - withRepeat, - withSequence, -} from 'react-native-reanimated'; - -import { ThemedText } from '@/components/ThemedText'; - -export function HelloWave() { - const rotationAnimation = useSharedValue(0); - - useEffect(() => { - rotationAnimation.value = withRepeat( - withSequence(withTiming(25, { duration: 150 }), withTiming(0, { duration: 150 })), - 4 // Run the animation 4 times - ); - }, []); - - const animatedStyle = useAnimatedStyle(() => ({ - transform: [{ rotate: `${rotationAnimation.value}deg` }], - })); - - return ( - - 👋 - - ); -} - -const styles = StyleSheet.create({ - text: { - fontSize: 28, - lineHeight: 32, - marginTop: -6, - }, -}); diff --git a/mobile/components/ParallaxScrollView.tsx b/mobile/components/ParallaxScrollView.tsx deleted file mode 100644 index 5df1d75f..00000000 --- a/mobile/components/ParallaxScrollView.tsx +++ /dev/null @@ -1,82 +0,0 @@ -import type { PropsWithChildren, ReactElement } from 'react'; -import { StyleSheet } from 'react-native'; -import Animated, { - interpolate, - useAnimatedRef, - useAnimatedStyle, - useScrollViewOffset, -} from 'react-native-reanimated'; - -import { ThemedView } from '@/components/ThemedView'; -import { useBottomTabOverflow } from '@/components/ui/TabBarBackground'; -import { useColorScheme } from '@/hooks/useColorScheme'; - -const HEADER_HEIGHT = 250; - -type Props = PropsWithChildren<{ - headerImage: ReactElement; - headerBackgroundColor: { dark: string; light: string }; -}>; - -export default function ParallaxScrollView({ - children, - headerImage, - headerBackgroundColor, -}: Props) { - const colorScheme = useColorScheme() ?? 'light'; - const scrollRef = useAnimatedRef(); - const scrollOffset = useScrollViewOffset(scrollRef); - const bottom = useBottomTabOverflow(); - const headerAnimatedStyle = useAnimatedStyle(() => { - return { - transform: [ - { - translateY: interpolate( - scrollOffset.value, - [-HEADER_HEIGHT, 0, HEADER_HEIGHT], - [-HEADER_HEIGHT / 2, 0, HEADER_HEIGHT * 0.75] - ), - }, - { - scale: interpolate(scrollOffset.value, [-HEADER_HEIGHT, 0, HEADER_HEIGHT], [2, 1, 1]), - }, - ], - }; - }); - - return ( - - - - {headerImage} - - {children} - - - ); -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - }, - header: { - height: HEADER_HEIGHT, - overflow: 'hidden', - }, - content: { - flex: 1, - padding: 32, - gap: 16, - overflow: 'hidden', - }, -}); diff --git a/mobile/components/ThemedText.tsx b/mobile/components/ThemedText.tsx deleted file mode 100644 index c0e1a78f..00000000 --- a/mobile/components/ThemedText.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { Text, type TextProps, StyleSheet } from 'react-native'; - -import { useThemeColor } from '@/hooks/useThemeColor'; - -export type ThemedTextProps = TextProps & { - lightColor?: string; - darkColor?: string; - type?: 'default' | 'title' | 'defaultSemiBold' | 'subtitle' | 'link'; -}; - -export function ThemedText({ - style, - lightColor, - darkColor, - type = 'default', - ...rest -}: ThemedTextProps) { - const color = useThemeColor({ light: lightColor, dark: darkColor }, 'text'); - - return ( - - ); -} - -const styles = StyleSheet.create({ - default: { - fontSize: 16, - lineHeight: 24, - }, - defaultSemiBold: { - fontSize: 16, - lineHeight: 24, - fontWeight: '600', - }, - title: { - fontSize: 32, - fontWeight: 'bold', - lineHeight: 32, - }, - subtitle: { - fontSize: 20, - fontWeight: 'bold', - }, - link: { - lineHeight: 30, - fontSize: 16, - color: '#0a7ea4', - }, -}); diff --git a/mobile/components/ThemedView.tsx b/mobile/components/ThemedView.tsx deleted file mode 100644 index 4d2cb09d..00000000 --- a/mobile/components/ThemedView.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { View, type ViewProps } from 'react-native'; - -import { useThemeColor } from '@/hooks/useThemeColor'; - -export type ThemedViewProps = ViewProps & { - lightColor?: string; - darkColor?: string; -}; - -export function ThemedView({ style, lightColor, darkColor, ...otherProps }: ThemedViewProps) { - const backgroundColor = useThemeColor({ light: lightColor, dark: darkColor }, 'background'); - - return ; -} diff --git a/mobile/components/__tests__/ThemedText-test.tsx b/mobile/components/__tests__/ThemedText-test.tsx deleted file mode 100644 index 1ac32250..00000000 --- a/mobile/components/__tests__/ThemedText-test.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import * as React from 'react'; -import renderer from 'react-test-renderer'; - -import { ThemedText } from '../ThemedText'; - -it(`renders correctly`, () => { - const tree = renderer.create(Snapshot test!).toJSON(); - - expect(tree).toMatchSnapshot(); -}); diff --git a/mobile/components/__tests__/__snapshots__/ThemedText-test.tsx.snap b/mobile/components/__tests__/__snapshots__/ThemedText-test.tsx.snap deleted file mode 100644 index b68e53e9..00000000 --- a/mobile/components/__tests__/__snapshots__/ThemedText-test.tsx.snap +++ /dev/null @@ -1,24 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`renders correctly 1`] = ` - - Snapshot test! - -`; diff --git a/mobile/components/ui/IconSymbol.ios.tsx b/mobile/components/ui/IconSymbol.ios.tsx deleted file mode 100644 index 9177f4da..00000000 --- a/mobile/components/ui/IconSymbol.ios.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import { SymbolView, SymbolViewProps, SymbolWeight } from 'expo-symbols'; -import { StyleProp, ViewStyle } from 'react-native'; - -export function IconSymbol({ - name, - size = 24, - color, - style, - weight = 'regular', -}: { - name: SymbolViewProps['name']; - size?: number; - color: string; - style?: StyleProp; - weight?: SymbolWeight; -}) { - return ( - - ); -} diff --git a/mobile/components/ui/IconSymbol.tsx b/mobile/components/ui/IconSymbol.tsx deleted file mode 100644 index f1fabd4a..00000000 --- a/mobile/components/ui/IconSymbol.tsx +++ /dev/null @@ -1,43 +0,0 @@ -// This file is a fallback for using MaterialIcons on Android and web. - -import MaterialIcons from '@expo/vector-icons/MaterialIcons'; -import { SymbolWeight } from 'expo-symbols'; -import React from 'react'; -import { OpaqueColorValue, StyleProp, ViewStyle } from 'react-native'; - -// Add your SFSymbol to MaterialIcons mappings here. -const MAPPING = { - // See MaterialIcons here: https://icons.expo.fyi - // See SF Symbols in the SF Symbols app on Mac. - 'house.fill': 'home', - 'paperplane.fill': 'send', - 'chevron.left.forwardslash.chevron.right': 'code', - 'chevron.right': 'chevron-right', -} as Partial< - Record< - import('expo-symbols').SymbolViewProps['name'], - React.ComponentProps['name'] - > ->; - -export type IconSymbolName = keyof typeof MAPPING; - -/** - * An icon component that uses native SFSymbols on iOS, and MaterialIcons on Android and web. This ensures a consistent look across platforms, and optimal resource usage. - * - * Icon `name`s are based on SFSymbols and require manual mapping to MaterialIcons. - */ -export function IconSymbol({ - name, - size = 24, - color, - style, -}: { - name: IconSymbolName; - size?: number; - color: string | OpaqueColorValue; - style?: StyleProp; - weight?: SymbolWeight; -}) { - return ; -} diff --git a/mobile/components/ui/TabBarBackground.ios.tsx b/mobile/components/ui/TabBarBackground.ios.tsx deleted file mode 100644 index 6668e78d..00000000 --- a/mobile/components/ui/TabBarBackground.ios.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { useBottomTabBarHeight } from '@react-navigation/bottom-tabs'; -import { BlurView } from 'expo-blur'; -import { StyleSheet } from 'react-native'; -import { useSafeAreaInsets } from 'react-native-safe-area-context'; - -export default function BlurTabBarBackground() { - return ( - - ); -} - -export function useBottomTabOverflow() { - const tabHeight = useBottomTabBarHeight(); - const { bottom } = useSafeAreaInsets(); - return tabHeight - bottom; -} diff --git a/mobile/components/ui/TabBarBackground.tsx b/mobile/components/ui/TabBarBackground.tsx deleted file mode 100644 index 70d1c3c0..00000000 --- a/mobile/components/ui/TabBarBackground.tsx +++ /dev/null @@ -1,6 +0,0 @@ -// This is a shim for web and Android where the tab bar is generally opaque. -export default undefined; - -export function useBottomTabOverflow() { - return 0; -} diff --git a/mobile/constants/Colors.ts b/mobile/constants/Colors.ts deleted file mode 100644 index 14e67844..00000000 --- a/mobile/constants/Colors.ts +++ /dev/null @@ -1,26 +0,0 @@ -/** - * Below are the colors that are used in the app. The colors are defined in the light and dark mode. - * There are many other ways to style your app. For example, [Nativewind](https://www.nativewind.dev/), [Tamagui](https://tamagui.dev/), [unistyles](https://reactnativeunistyles.vercel.app), etc. - */ - -const tintColorLight = '#0a7ea4'; -const tintColorDark = '#fff'; - -export const Colors = { - light: { - text: '#11181C', - background: '#fff', - tint: tintColorLight, - icon: '#687076', - tabIconDefault: '#687076', - tabIconSelected: tintColorLight, - }, - dark: { - text: '#ECEDEE', - background: '#151718', - tint: tintColorDark, - icon: '#9BA1A6', - tabIconDefault: '#9BA1A6', - tabIconSelected: tintColorDark, - }, -}; diff --git a/mobile/hooks/useColorScheme.ts b/mobile/hooks/useColorScheme.ts deleted file mode 100644 index 17e3c63e..00000000 --- a/mobile/hooks/useColorScheme.ts +++ /dev/null @@ -1 +0,0 @@ -export { useColorScheme } from 'react-native'; diff --git a/mobile/hooks/useColorScheme.web.ts b/mobile/hooks/useColorScheme.web.ts deleted file mode 100644 index 7eb1c1b7..00000000 --- a/mobile/hooks/useColorScheme.web.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { useEffect, useState } from 'react'; -import { useColorScheme as useRNColorScheme } from 'react-native'; - -/** - * To support static rendering, this value needs to be re-calculated on the client side for web - */ -export function useColorScheme() { - const [hasHydrated, setHasHydrated] = useState(false); - - useEffect(() => { - setHasHydrated(true); - }, []); - - const colorScheme = useRNColorScheme(); - - if (hasHydrated) { - return colorScheme; - } - - return 'light'; -} diff --git a/mobile/hooks/useThemeColor.ts b/mobile/hooks/useThemeColor.ts deleted file mode 100644 index 0608e731..00000000 --- a/mobile/hooks/useThemeColor.ts +++ /dev/null @@ -1,21 +0,0 @@ -/** - * Learn more about light and dark modes: - * https://docs.expo.dev/guides/color-schemes/ - */ - -import { Colors } from '@/constants/Colors'; -import { useColorScheme } from '@/hooks/useColorScheme'; - -export function useThemeColor( - props: { light?: string; dark?: string }, - colorName: keyof typeof Colors.light & keyof typeof Colors.dark -) { - const theme = useColorScheme() ?? 'light'; - const colorFromProps = props[theme]; - - if (colorFromProps) { - return colorFromProps; - } else { - return Colors[theme][colorName]; - } -} diff --git a/mobile/image-test/image test.png b/mobile/image-test/image test.png deleted file mode 100644 index 48f74126..00000000 Binary files a/mobile/image-test/image test.png and /dev/null differ diff --git a/mobile/image-test/image test2.png b/mobile/image-test/image test2.png deleted file mode 100644 index ca53c3e3..00000000 Binary files a/mobile/image-test/image test2.png and /dev/null differ diff --git a/mobile/package.json b/mobile/package.json deleted file mode 100644 index efde086a..00000000 --- a/mobile/package.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "name": "mobile", - "main": "expo-router/entry", - "version": "1.0.0", - "scripts": { - "start": "expo start", - "reset-project": "node ./scripts/reset-project.js", - "android": "expo start --android", - "ios": "expo start --ios", - "web": "expo start --web", - "test": "jest --watchAll", - "lint": "expo lint" - }, - "jest": { - "preset": "jest-expo" - }, - "dependencies": { - "@expo/vector-icons": "^14.0.2", - "@react-navigation/bottom-tabs": "^7.2.0", - "@react-navigation/native": "^7.0.14", - "expo": "~52.0.43", - "expo-blur": "~14.0.3", - "expo-constants": "~17.0.8", - "expo-font": "~13.0.4", - "expo-haptics": "~14.0.1", - "expo-linking": "~7.0.5", - "expo-router": "~4.0.20", - "expo-splash-screen": "~0.29.22", - "expo-status-bar": "~2.0.1", - "expo-symbols": "~0.2.2", - "expo-system-ui": "~4.0.9", - "expo-web-browser": "~14.0.2", - "react": "18.3.1", - "react-dom": "18.3.1", - "react-native": "0.76.9", - "react-native-gesture-handler": "~2.20.2", - "react-native-reanimated": "~3.16.1", - "react-native-safe-area-context": "4.12.0", - "react-native-screens": "~4.4.0", - "react-native-web": "~0.19.13", - "react-native-webview": "13.12.5" - }, - "devDependencies": { - "@babel/core": "^7.25.2", - "@types/jest": "^29.5.12", - "@types/react": "~18.3.12", - "@types/react-test-renderer": "^18.3.0", - "jest": "^29.2.1", - "jest-expo": "~52.0.6", - "react-test-renderer": "18.3.1", - "typescript": "^5.3.3" - }, - "private": true -} diff --git a/mobile/scripts/reset-project.js b/mobile/scripts/reset-project.js deleted file mode 100644 index 51dff15a..00000000 --- a/mobile/scripts/reset-project.js +++ /dev/null @@ -1,112 +0,0 @@ -#!/usr/bin/env node - -/** - * This script is used to reset the project to a blank state. - * It deletes or moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example based on user input and creates a new /app directory with an index.tsx and _layout.tsx file. - * You can remove the `reset-project` script from package.json and safely delete this file after running it. - */ - -const fs = require("fs"); -const path = require("path"); -const readline = require("readline"); - -const root = process.cwd(); -const oldDirs = ["app", "components", "hooks", "constants", "scripts"]; -const exampleDir = "app-example"; -const newAppDir = "app"; -const exampleDirPath = path.join(root, exampleDir); - -const indexContent = `import { Text, View } from "react-native"; - -export default function Index() { - return ( - - Edit app/index.tsx to edit this screen. - - ); -} -`; - -const layoutContent = `import { Stack } from "expo-router"; - -export default function RootLayout() { - return ; -} -`; - -const rl = readline.createInterface({ - input: process.stdin, - output: process.stdout, -}); - -const moveDirectories = async (userInput) => { - try { - if (userInput === "y") { - // Create the app-example directory - await fs.promises.mkdir(exampleDirPath, { recursive: true }); - console.log(`📁 /${exampleDir} directory created.`); - } - - // Move old directories to new app-example directory or delete them - for (const dir of oldDirs) { - const oldDirPath = path.join(root, dir); - if (fs.existsSync(oldDirPath)) { - if (userInput === "y") { - const newDirPath = path.join(root, exampleDir, dir); - await fs.promises.rename(oldDirPath, newDirPath); - console.log(`➡️ /${dir} moved to /${exampleDir}/${dir}.`); - } else { - await fs.promises.rm(oldDirPath, { recursive: true, force: true }); - console.log(`❌ /${dir} deleted.`); - } - } else { - console.log(`➡️ /${dir} does not exist, skipping.`); - } - } - - // Create new /app directory - const newAppDirPath = path.join(root, newAppDir); - await fs.promises.mkdir(newAppDirPath, { recursive: true }); - console.log("\n📁 New /app directory created."); - - // Create index.tsx - const indexPath = path.join(newAppDirPath, "index.tsx"); - await fs.promises.writeFile(indexPath, indexContent); - console.log("📄 app/index.tsx created."); - - // Create _layout.tsx - const layoutPath = path.join(newAppDirPath, "_layout.tsx"); - await fs.promises.writeFile(layoutPath, layoutContent); - console.log("📄 app/_layout.tsx created."); - - console.log("\n✅ Project reset complete. Next steps:"); - console.log( - `1. Run \`npx expo start\` to start a development server.\n2. Edit app/index.tsx to edit the main screen.${ - userInput === "y" - ? `\n3. Delete the /${exampleDir} directory when you're done referencing it.` - : "" - }` - ); - } catch (error) { - console.error(`❌ Error during script execution: ${error.message}`); - } -}; - -rl.question( - "Do you want to move existing files to /app-example instead of deleting them? (Y/n): ", - (answer) => { - const userInput = answer.trim().toLowerCase() || "y"; - if (userInput === "y" || userInput === "n") { - moveDirectories(userInput).finally(() => rl.close()); - } else { - console.log("❌ Invalid input. Please enter 'Y' or 'N'."); - rl.close(); - } - } -); diff --git a/mobile/tsconfig.json b/mobile/tsconfig.json deleted file mode 100644 index 909e9010..00000000 --- a/mobile/tsconfig.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "extends": "expo/tsconfig.base", - "compilerOptions": { - "strict": true, - "paths": { - "@/*": [ - "./*" - ] - } - }, - "include": [ - "**/*.ts", - "**/*.tsx", - ".expo/types/**/*.ts", - "expo-env.d.ts" - ] -} diff --git a/package-lock.json b/package-lock.json index c61d591b..9e1b6000 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,8 +15,9 @@ }, "backend": { "version": "1.0.0", + "license": "ISC", "dependencies": { - "express": "^4.18.2" + "express": "^4.22.2" } }, "frontend": { @@ -7481,22 +7482,23 @@ } }, "node_modules/body-parser": { - "version": "1.20.3", - "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.3.tgz", - "integrity": "sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==", + "version": "1.20.5", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.5.tgz", + "integrity": "sha512-3grm+/2tUOvu2cjJkvsIxrv/wVpfXQW4PsQHYm7yk4vfpu7Ekl6nEsYBoJUL6qDwZUx8wUhQ8tR2qz+ad9c9OA==", + "license": "MIT", "dependencies": { - "bytes": "3.1.2", + "bytes": "~3.1.2", "content-type": "~1.0.5", "debug": "2.6.9", "depd": "2.0.0", - "destroy": "1.2.0", - "http-errors": "2.0.0", - "iconv-lite": "0.4.24", - "on-finished": "2.4.1", - "qs": "6.13.0", - "raw-body": "2.5.2", + "destroy": "~1.2.0", + "http-errors": "~2.0.1", + "iconv-lite": "~0.4.24", + "on-finished": "~2.4.1", + "qs": "~6.15.1", + "raw-body": "~2.5.3", "type-is": "~1.6.18", - "unpipe": "1.0.0" + "unpipe": "~1.0.0" }, "engines": { "node": ">= 0.8", @@ -7507,14 +7509,45 @@ "version": "2.6.9", "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "license": "MIT", "dependencies": { "ms": "2.0.0" } }, + "node_modules/body-parser/node_modules/http-errors": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz", + "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==", + "license": "MIT", + "dependencies": { + "depd": "~2.0.0", + "inherits": "~2.0.4", + "setprototypeof": "~1.2.0", + "statuses": "~2.0.2", + "toidentifier": "~1.0.1" + }, + "engines": { + "node": ">= 0.8" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/express" + } + }, "node_modules/body-parser/node_modules/ms": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", - "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==" + "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", + "license": "MIT" + }, + "node_modules/body-parser/node_modules/statuses": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz", + "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==", + "license": "MIT", + "engines": { + "node": ">= 0.8" + } }, "node_modules/bplist-creator": { "version": "0.0.7", @@ -8205,6 +8238,7 @@ "version": "1.0.5", "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz", "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==", + "license": "MIT", "engines": { "node": ">= 0.6" } @@ -9830,38 +9864,39 @@ "integrity": "sha512-8QxYTVXUkuy7fIIoitQkPwGonB8F3Zj8eEO8Sqg9Zv/bkI7RJAzowee4gr81Hak/dUTpA2Z7VfQgoijjPNlUZA==" }, "node_modules/express": { - "version": "4.21.2", - "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz", - "integrity": "sha512-28HqgMZAmih1Czt9ny7qr6ek2qddF4FclbMzwhCREB6OFfH+rXAnuNCwo1/wFvrtbgsQDb4kSbX9de9lFbrXnA==", + "version": "4.22.2", + "resolved": "https://registry.npmjs.org/express/-/express-4.22.2.tgz", + "integrity": "sha512-IuL+Elrou2ZvCFHs18/CIzy2Nzvo25nZ1/D2eIZlz7c+QUayAcYoiM2BthCjs+EBHVpjYjcuLDAiCWgeIX3X1Q==", + "license": "MIT", "dependencies": { "accepts": "~1.3.8", "array-flatten": "1.1.1", - "body-parser": "1.20.3", - "content-disposition": "0.5.4", + "body-parser": "~1.20.5", + "content-disposition": "~0.5.4", "content-type": "~1.0.4", - "cookie": "0.7.1", - "cookie-signature": "1.0.6", + "cookie": "~0.7.1", + "cookie-signature": "~1.0.6", "debug": "2.6.9", "depd": "2.0.0", "encodeurl": "~2.0.0", "escape-html": "~1.0.3", "etag": "~1.8.1", - "finalhandler": "1.3.1", - "fresh": "0.5.2", - "http-errors": "2.0.0", + "finalhandler": "~1.3.1", + "fresh": "~0.5.2", + "http-errors": "~2.0.0", "merge-descriptors": "1.0.3", "methods": "~1.1.2", - "on-finished": "2.4.1", + "on-finished": "~2.4.1", "parseurl": "~1.3.3", - "path-to-regexp": "0.1.12", + "path-to-regexp": "~0.1.12", "proxy-addr": "~2.0.7", - "qs": "6.13.0", + "qs": "~6.15.1", "range-parser": "~1.2.1", "safe-buffer": "5.2.1", - "send": "0.19.0", - "serve-static": "1.16.2", + "send": "~0.19.0", + "serve-static": "~1.16.2", "setprototypeof": "1.2.0", - "statuses": "2.0.1", + "statuses": "~2.0.1", "type-is": "~1.6.18", "utils-merge": "1.0.1", "vary": "~1.1.2" @@ -9904,37 +9939,6 @@ "node": ">= 0.8" } }, - "node_modules/express/node_modules/send": { - "version": "0.19.0", - "resolved": "https://registry.npmjs.org/send/-/send-0.19.0.tgz", - "integrity": "sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==", - "dependencies": { - "debug": "2.6.9", - "depd": "2.0.0", - "destroy": "1.2.0", - "encodeurl": "~1.0.2", - "escape-html": "~1.0.3", - "etag": "~1.8.1", - "fresh": "0.5.2", - "http-errors": "2.0.0", - "mime": "1.6.0", - "ms": "2.1.3", - "on-finished": "2.4.1", - "range-parser": "~1.2.1", - "statuses": "2.0.1" - }, - "engines": { - "node": ">= 0.8.0" - } - }, - "node_modules/express/node_modules/send/node_modules/encodeurl": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz", - "integrity": "sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==", - "engines": { - "node": ">= 0.8" - } - }, "node_modules/fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", @@ -10876,6 +10880,7 @@ "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", + "license": "MIT", "dependencies": { "safer-buffer": ">= 2.1.2 < 3" }, @@ -13108,6 +13113,7 @@ "version": "0.3.0", "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", "integrity": "sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==", + "license": "MIT", "engines": { "node": ">= 0.6" } @@ -14798,11 +14804,12 @@ } }, "node_modules/qs": { - "version": "6.13.0", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz", - "integrity": "sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==", + "version": "6.15.2", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.2.tgz", + "integrity": "sha512-Rzq0KEyX/w/tEybncDgdkZrJgVUsUMk3xjh3t5bv3S1HTAtg+uOYt72+ZfwiQwKdysThkTBdL/rTi6HDmX9Ddw==", + "license": "BSD-3-Clause", "dependencies": { - "side-channel": "^1.0.6" + "side-channel": "^1.1.0" }, "engines": { "node": ">=0.6" @@ -14880,15 +14887,45 @@ } }, "node_modules/raw-body": { - "version": "2.5.2", - "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz", - "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==", + "version": "2.5.3", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.3.tgz", + "integrity": "sha512-s4VSOf6yN0rvbRZGxs8Om5CWj6seneMwK3oDb4lWDH0UPhWcxwOWw5+qk24bxq87szX1ydrwylIOp2uG1ojUpA==", + "license": "MIT", + "dependencies": { + "bytes": "~3.1.2", + "http-errors": "~2.0.1", + "iconv-lite": "~0.4.24", + "unpipe": "~1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, + "node_modules/raw-body/node_modules/http-errors": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz", + "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==", + "license": "MIT", "dependencies": { - "bytes": "3.1.2", - "http-errors": "2.0.0", - "iconv-lite": "0.4.24", - "unpipe": "1.0.0" + "depd": "~2.0.0", + "inherits": "~2.0.4", + "setprototypeof": "~1.2.0", + "statuses": "~2.0.2", + "toidentifier": "~1.0.1" }, + "engines": { + "node": ">= 0.8" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/express" + } + }, + "node_modules/raw-body/node_modules/statuses": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz", + "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==", + "license": "MIT", "engines": { "node": ">= 0.8" } @@ -17378,6 +17415,7 @@ "version": "1.6.18", "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz", "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==", + "license": "MIT", "dependencies": { "media-typer": "0.3.0", "mime-types": "~2.1.24"