Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
73 changes: 7 additions & 66 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,71 +1,12 @@
# 🚀 Internship Task – ToDo App using React
# React + Vite

Your challenge is to build a clean, functional, and responsive **ToDo App** using **React**. This task will showcase your understanding of front-end development, component structure, and user interaction.
This template provides a minimal se tup to get React working in Vite with HMR and some ESLint rules.

---
Currently, two official plugins are available:

## 📝 Task Description
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

Build a ToDo App that allows users to:
## Expanding the ESLint configuration

- Add tasks
- Mark tasks as completed or not
- Delete tasks

---

## 🎯 Required Features

### 🧾 Core Requirements

- ✅ Add new tasks
- ✅ Display tasks
- ✅ Mark tasks as complete/incomplete
- ✅ Delete tasks

### ✨ Bonus (Optional)

- 🔄 Filter tasks: All / Active / Completed
- 💾 Persist tasks using `localStorage`
- 📱 Make it mobile responsive
- 🎨 Use modern UI libraries like [ShadCN UI](https://ui.shadcn.com/) for better design

---

## 🛠 Tech Stack Guidelines

- You **must use React**.
- You can use **Vite** (recommended for faster setup).
- You may use **ShadCN UI**, **Tailwind CSS**, or any other modern styling solution.

---

## 🧠 Tips

- Use functional components and hooks (`useState`, `useEffect`, etc.)
- Keep your components modular
- Ensure a smooth and simple user experience

---

## 🔧 Submission Instructions

1. **Fork** this repository.
2. Build your app there using Vite + React or any other stack.
3. Once you're done, **create a Pull Request**.
4. Make sure your app runs correctly and looks good on different screen sizes.
5. HOST YOUR WEBSITE WITH PLATFORMS LIKE [VERCEL](https://vercel.com/).

---

## 💬 Need Help?

If you get stuck:
- Use Google or AI tools like ChatGPT
- Check out [Vite Docs](https://vitejs.dev/guide/)
- Explore [ShadCN UI](https://ui.shadcn.com/docs/installation)
- Get in touch with your team lead or team mates for support.

---

## 🙌 Good Luck & Happy Coding!
If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) for information on how to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project.
33 changes: 33 additions & 0 deletions eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'

export default [
{ ignores: ['dist'] },
{
files: ['**/*.{js,jsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
parserOptions: {
ecmaVersion: 'latest',
ecmaFeatures: { jsx: true },
sourceType: 'module',
},
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...js.configs.recommended.rules,
...reactHooks.configs.recommended.rules,
'no-unused-vars': ['error', { varsIgnorePattern: '^[A-Z_]' }],
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
},
]
18 changes: 18 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Todo Web</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>
Loading