diff --git a/src/components/Resources.jsx b/src/components/Resources.jsx index cf8e22a..0f11fe8 100644 --- a/src/components/Resources.jsx +++ b/src/components/Resources.jsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from "react"; -import { FaChevronDown, FaChevronUp } from "react-icons/fa"; +import { FaChevronDown, FaChevronUp, FaYoutube } from "react-icons/fa"; const resourcesData = { webDev: [ @@ -15,42 +15,42 @@ const resourcesData = { ], task: "Create a simple portfolio website with an 'About Me' section, projects, and contact info.", links: [ - { name: "MDN HTML Guide", url: "https://developer.mozilla.org/en-US/docs/Web/HTML" }, - { name: "CSS Flexbox Guide", url: "https://css-tricks.com/snippets/css/a-guide-to-flexbox/" }, - { name: "CSS Grid Tutorial", url: "https://css-tricks.com/snippets/css/complete-guide-grid/" }, - { name: "GitHub Pages Docs", url: "https://docs.github.com/en/pages" }, + { name: "MDN HTML Guide", url: "https://developer.mozilla.org/en-US/docs/Web/HTML", youtube: "https://youtu.be/qz0aGYrrlhU" }, + { name: "CSS Flexbox Guide", url: "https://css-tricks.com/snippets/css/a-guide-to-flexbox/", youtube: "https://www.youtube.com/watch?v=3_9znKVNe5g" }, + { name: "HTML Cheat Sheet", url: "https://www.geeksforgeeks.org/html-cheat-sheet", youtube: "https://youtu.be/HD13eq_Pmp8" }, + { name: "CSS Basics (MDN)", url: "https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/CSS_basics", youtube: "https://www.youtube.com/watch?v=EUtlj7xdO1o" }, ], - }, - { + },{ week: 2, - title: "JavaScript & DOM Manipulation", - project: "To-Do List App", + title: "Frontend Framework (React.js)", + project: "Weather App", topics: [ - "JavaScript Basics (Variables, Functions, Loops)", - "DOM Manipulation (Event Listeners, getElementById, querySelector)", - "Local Storage (Saving Data in Browser)", + "Introduction to React (Components, Props, State)", + "Fetching API Data (Using fetch() or axios)", + "JSX & Conditional Rendering", ], - task: "Build a To-Do list where users can add, delete, and mark tasks as completed.", + task: "Build a Weather App that fetches weather data based on user input (city name) using a weather API.", links: [ - { name: "JavaScript.info", url: "https://javascript.info/" }, - { name: "DOM Manipulation Guide", url: "https://www.w3schools.com/js/js_htmldom.asp" }, - { name: "Local Storage Tutorial", url: "https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage" }, + { name: "React Official Docs", url: "https://react.dev/", youtube: "https://youtube.com/playlist?list=PL4cUxeGkcC9gZD-Tvwfod2gaISzfRiP9d&si=AM4Zg0nawQQArNCd" }, + { name: "OpenWeather API", url: "https://openweathermap.org/api", youtube: "https://www.youtube.com/watch?v=MdIfZJ08g2I" }, + { name: "Axios Guide", url: "https://axios-http.com/docs/intro", youtube: "https://www.youtube.com/watch?v=fYTTUBa-lPc" }, ], }, { week: 3, - title: "Frontend Framework (React.js)", - project: "Weather App", + title: "JavaScript & DOM Manipulation", + project: "To-Do List App", topics: [ - "Introduction to React (Components, Props, State)", - "Fetching API Data (Using fetch() or axios)", - "JSX & Conditional Rendering", + "JavaScript Basics (Variables, Functions, Loops)", + "DOM Manipulation (Event Listeners, getElementById, querySelector)", + "Local Storage (Saving Data in Browser)", ], - task: "Build a Weather App that fetches weather data based on user input (city name) using a weather API.", + task: "Build a To-Do list where users can add, delete, and mark tasks as completed.", links: [ - { name: "React Official Docs", url: "https://react.dev/" }, - { name: "OpenWeather API", url: "https://openweathermap.org/api" }, - { name: "Axios Guide", url: "https://axios-http.com/docs/intro" }, + { name: "JavaScript Tutorial (W3Schools)", url: "https://www.w3schools.com/js/js_intro.asp", youtube: "https://youtu.be/PkZNo7MFNFg?si=CMUH2pctHH3q8ztS" }, + { name: "DOM Manipulation Guide", url: "https://www.w3schools.com/js/js_htmldom.asp", youtube: "https://www.youtube.com/watch?v=5fb2aPlgoys" }, + { name: "Local Storage Tutorial", url: "https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage", youtube: "https://www.youtube.com/watch?v=Av6HTmH3FUc" }, + { name: "Advanced JS Concepts", url: "https://madasamy.medium.com/15-javascript-concepts-that-every-nodejs-programmer-must-to-know-6894f5157cb7"}, ], }, { @@ -64,10 +64,10 @@ const resourcesData = { ], task: "Create a Notes App where users can create, update, and delete notes with a simple backend.", links: [ - { name: "Node.js Docs", url: "https://nodejs.org/en/docs/" }, - { name: "Express.js Guide", url: "https://expressjs.com/" }, - { name: "MongoDB Tutorial", url: "https://www.mongodb.com/docs/" }, - { name: "MERN Stack Tutorial", url: "https://www.mongodb.com/languages/mern-stack-tutorial" }, + { name: "Node.js Docs", url: "https://nodejs.org/en/docs/", youtube: "https://youtube.com/playlist?list=PL4cUxeGkcC9jsz4LDYc6kv3ymONOKxwBU&si=U_YO8RaMf3qHCQ6K" }, + { name: "Express.js Guide", url: "https://expressjs.com/", youtube: "https://www.youtube.com/watch?v=SccSCuHhOw0" }, + { name: "MongoDB Tutorial", url: "https://www.mongodb.com/docs/", youtube: "https://www.youtube.com/watch?v=ofme2o29ngU" }, + { name: "MERN Stack Tutorial", url: "https://www.mongodb.com/languages/mern-stack-tutorial", youtube: "https://www.youtube.com/watch?v=7CqJlxBYj-M" }, ], }, ], @@ -84,9 +84,9 @@ const resourcesData = { ], task: "Build a basic quiz app.", links: [ - { name: "Flutter Setup Guide", url: "https://flutter.dev/docs/get-started/install" }, - { name: "Dart Language Tour", url: "https://dart.dev/guides/language/language-tour" }, - { name: "Flutter Basics Codelab", url: "https://codelabs.developers.google.com/codelabs/flutter-codelab-first" }, + { name: "Flutter Setup Guide", url: "https://docs.flutter.dev/get-started/install", youtube: "https://www.youtube.com/watch?v=1ukSR1GRtMU" }, + { name: "Dart Language Tour", url: "https://dart.dev/guides/language/language-tour", youtube: "https://youtube.com/playlist?list=PL4cUxeGkcC9iVGY3ppchN9kIauln8IiEh&si=hntDZJaNC73px5Lq" }, + { name: "Flutter Basics Codelab", url: "https://codelabs.developers.google.com/codelabs/flutter-codelab-first", youtube: "https://www.youtube.com/watch?v=GLSG_Wh_YWc" }, ], }, { @@ -100,9 +100,9 @@ const resourcesData = { ], task: "Build a personal expenses app with responsive design.", links: [ - { name: "Flutter Widgets Catalog", url: "https://flutter.dev/docs/development/ui/widgets" }, - { name: "Responsive Design in Flutter", url: "https://flutter.dev/docs/development/ui/layout/responsive" }, - { name: "Flutter Codelabs", url: "https://flutter.dev/docs/codelabs" }, + { name: "Flutter Widgets Catalog", url: "https://docs.flutter.dev/ui/widgets", youtube: "https://youtu.be/wE7khGHVkYY?si=NqJ3hANEMPdnG9xN" }, + { name: "Responsive Design in Flutter", url: "https://docs.flutter.dev/ui/layout/responsive", youtube: "https://youtu.be/MrPJBAOzKTQ?si=xPo2kHa5hqblOssr" }, + { name: "Flutter Layout Guide", url: "https://docs.flutter.dev/ui/layout", youtube: "https://youtu.be/RJEnTRBxaSg?si=HRYXNH8m1X-AUGOi" }, ], }, { @@ -112,15 +112,14 @@ const resourcesData = { topics: [ "Widgets & Flutter Internals (Deep Dive)", "Navigation & Multiple Screens", - "State Management (MVP)", "Working with User Input & Forms", "Sending HTTP Requests", ], task: "Develop a meals app and start a shop app with navigation and forms.", links: [ - { name: "Flutter Navigation Guide", url: "https://flutter.dev/docs/cookbook/navigation" }, - { name: "State Management in Flutter", url: "https://flutter.dev/docs/development/data-and-backend/state-mgmt" }, - { name: "Flutter HTTP Requests", url: "https://flutter.dev/docs/cookbook/networking/fetch-data" }, + { name: "Flutter Navigation Guide", url: "https://docs.flutter.dev/ui/navigation", youtube: "https://youtu.be/DlArCl8jvlo?si=mFzJNtg9T55OkRO2" }, + { name: "State Management in Flutter", url: "https://docs.flutter.dev/data-and-backend/state-mgmt", youtube: "https://youtu.be/3tm-R7ymwhc?si=yTRnq6sIQnePeI0S" }, + { name: "Flutter HTTP Requests", url: "https://docs.flutter.dev/cookbook/networking/fetch-data", youtube: "https://youtube.com/playlist?list=PL7zgwanvi8_OvGhdNt1pwvN2luynjiH1V&si=u7BXVZ1emTvnx-q9" }, ], }, { @@ -134,9 +133,8 @@ const resourcesData = { ], task: "Enhance the shop app with authentication and animations.", links: [ - { name: "Firebase Authentication", url: "https://firebase.google.com/docs/auth/flutter/start" }, - { name: "Flutter Animations Guide", url: "https://flutter.dev/docs/development/ui/animations" }, - { name: "Flutter Shop App Tutorial", url: "https://www.youtube.com/watch?v=3z1J3aAFW8g" }, + { name: "Firebase Authentication Docs", url: "https://firebase.google.com/docs/auth/flutter/start", youtube: "https://youtu.be/rWamixHIKmQ?si=C7eCuRl5qbdGx2Cc" }, + { name: "Flutter Animations Guide", url: "https://docs.flutter.dev/ui/animations", youtube: "https://youtube.com/playlist?list=PL4cUxeGkcC9gP1qg8yj-Jokef29VRCLt1&si=YBCV9v9H4oxd1C-F" }, ], }, ], @@ -152,10 +150,10 @@ const resourcesData = { ], task: "Solve 3-4 LeetCode problems on basic C++ and STL, analyze their complexity.", links: [ - { name: "C++ Tutorial", url: "https://www.geeksforgeeks.org/c-plus-plus/" }, - { name: "STL Guide", url: "https://www.geeksforgeeks.org/the-c-standard-template-library-stl/" }, - { name: "Complexity Analysis", url: "https://www.programiz.com/dsa/time-complexity" }, - { name: "LeetCode Problems", url: "https://leetcode.com/problemset/all/" }, + { name: "C++ Tutorial", url: "https://www.geeksforgeeks.org/c-plus-plus/", youtube: "https://www.youtube.com/watch?v=Bn6lBj0DffE" }, + { name: "C++ STL Guide", url: "https://www.geeksforgeeks.org/the-c-standard-template-library-stl/", youtube: "https://www.youtube.com/watch?v=mlseT4mj4c0" }, + { name: "Time and Space Complexity", url: "https://www.geeksforgeeks.org/time-complexity-and-space-complexity/", youtube: "https://www.youtube.com/watch?v=DEHsr4Xic9w" }, + { name: "C++ OOPS Concepts", url: "https://www.w3schools.com/cpp/cpp_oop.asp" }, ], }, { @@ -171,10 +169,10 @@ const resourcesData = { ], task: "Solve 3-4 LeetCode problems on strings, arrays, and stacks, implement Tower of Hanoi.", links: [ - { name: "String Problems", url: "https://leetcode.com/tag/string/" }, - { name: "Recursion Tutorial", url: "https://www.geeksforgeeks.org/introduction-to-recursion-data-structure-and-algorithm-tutorials/" }, - { name: "Array Operations", url: "https://www.geeksforgeeks.org/array-data-structure/" }, - { name: "Stack Applications", url: "https://www.programiz.com/dsa/stack" }, + { name: "Strings in C++", url: "https://www.geeksforgeeks.org/string-data-structure/", youtube: "https://youtu.be/ijIxcB9qjaU?si=zb_ay66PfPFi2oE3" }, + { name: "Recursion Tutorial", url: "https://www.geeksforgeeks.org/what-is-recursion/", youtube: "https://youtu.be/c7VjS7ZZVWM?si=yotRIh450aagTnbT" }, + { name: "Array Operations", url: "https://www.geeksforgeeks.org/array-data-structure/", youtube: "https://www.youtube.com/watch?v=Bnjbun-hiBk" }, + { name: "Stacks and Queues", url: "https://www.geeksforgeeks.org/stack-data-structure/", youtube: "https://www.youtube.com/watch?v=PPIdmeO8E-Q" }, ], }, { @@ -188,10 +186,10 @@ const resourcesData = { ], task: "Solve 3-4 LeetCode problems on linked lists and sorting, implement hash maps.", links: [ - { name: "Linked List Guide", url: "https://www.geeksforgeeks.org/data-structures/linked-list/" }, - { name: "Sorting Algorithms", url: "https://www.geeksforgeeks.org/sorting-algorithms/" }, - { name: "Hash Map Tutorial", url: "https://www.geeksforgeeks.org/hash-maps-in-cpp/" }, - { name: "LeetCode Sorting", url: "https://leetcode.com/tag/sorting/" }, + { name: "Linked List Guide", url: "https://www.geeksforgeeks.org/data-structures/linked-list/", youtube: "https://www.youtube.com/watch?v=o5wJkJJpKtM" }, + { name: "Quick Sort Algorithm", url: "https://www.geeksforgeeks.org/quick-sort/", youtube: "https://www.youtube.com/watch?v=ogjf7ORKfd8" }, + { name: "Merge Sort Algorithm", url: "https://www.geeksforgeeks.org/merge-sort/", youtube: "https://www.youtube.com/watch?v=ogjf7ORKfd8" }, + { name: "Insertion Sort Algorithm", url: "https://www.geeksforgeeks.org/insertion-sort/", youtube: "https://www.youtube.com/watch?v=C46QfTjVCNU" }, ], }, { @@ -206,10 +204,11 @@ const resourcesData = { ], task: "Solve 3-4 LeetCode problems on searching, two pointers, and trees.", links: [ - { name: "Binary Search Guide", url: "https://www.geeksforgeeks.org/binary-search/" }, - { name: "Two Pointer Technique", url: "https://www.geeksforgeeks.org/two-pointer-technique/" }, - { name: "Sliding Window Tutorial", url: "https://www.geeksforgeeks.org/window-sliding-technique/" }, - { name: "Tree Problems", url: "https://leetcode.com/tag/tree/" }, + { name: "Binary Search Guide", url: "https://www.geeksforgeeks.org/binary-search/", youtube: "https://www.youtube.com/watch?v=T2sFYY-fT5o" }, + { name: "Two Pointer Technique", url: "https://www.geeksforgeeks.org/two-pointer-technique/", youtube: "https://www.youtube.com/watch?v=syTs9_w-pwA" }, + { name: "Sliding Window Tutorial", url: "https://www.geeksforgeeks.org/window-sliding-technique/", youtube: "https://www.youtube.com/watch?v=EHCGAZBbB88&feature=youtu.be" }, + { name: "Tree Data Structures", url: "https://www.geeksforgeeks.org/introduction-to-tree-data-structure-and-algorithm-tutorials/", youtube: "https://www.youtube.com/watch?v=fnmisPM6cVo" }, + { name: "Dynamic Programming", url: "https://www.geeksforgeeks.org/dynamic-programming/", youtube: "https://www.youtube.com/watch?v=nqowUJzG-iM&feature=youtu.be" }, ], }, ], @@ -271,14 +270,26 @@ const ResourceCard = ({ week, title, project, topics, task, links, isOpen, toggl {links.map((link, index) => (
  • - - {link.name} - +
    + + {link.name} + + {link.youtube && ( + + + + )} +
    • ))} diff --git a/src/pages/AuthPage.jsx b/src/pages/AuthPage.jsx index a05113d..0ede137 100644 --- a/src/pages/AuthPage.jsx +++ b/src/pages/AuthPage.jsx @@ -307,52 +307,51 @@ const AuthPage = () => {
    -
    - +
    setRegisterData({ ...registerData, name: e.target.value })} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    setRegisterData({ ...registerData, email: e.target.value })} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    setRegisterData({ ...registerData, usn: e.target.value })} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    +
    -
    - +
    setRegisterData({ ...registerData, mobile: e.target.value })} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    setRegisterData({ ...registerData, password: e.target.value })} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    setConfPass(e.target.value)} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    @@ -306,7 +448,7 @@ const ProfileSection = () => {

    - You are enrolled in  + You are enrolled in  {progDetailed} @@ -317,87 +459,186 @@ const ProfileSection = () => {

    - { -
    -

    Build your team

    -

    Team can have max three members

    -
    -
    - - +
    +
    + setIsIndividual(e.target.checked)} + className="mr-2" + /> + +
    +

    Team Settings

    +
    + {!teamOption && !team ? ( +
    + +
    -
    - - setMemberTeam({ ...memberTeam, a: e.target.value })} - /> + ) : null} + {(teamOption === 'create' || team) && ( +
    +
    +
    + setTeamName(e.target.value)} + onFocus={handleTeamNameFocus} + className="border-b border-gray-300 focus:border-orange-500 outline-none text-gray-700 text-sm font-bold" + placeholder="team name" + /> + {email === team?.l && ( + + )} +
    + {teamCode && ( +
    + {teamCode} + +
    + )} +
    +

    Team can have max four members

    +
    + {[...Array(4)].map((_, index) => ( +
    + {members[index] ? ( + <> + + + {members[index].isLeader && ( + Leader + )} + {email === team?.l && !members[index].isLeader && ( + + )} + + ) : ( + <> + + + + )} +
    + ))} +
    +
    -
    - - setMemberTeam({ ...memberTeam, b: e.target.value })} - /> + )} + {teamOption === 'join' && ( +
    +

    Enter the team code to join a team

    +
    + setJoinTeamCode(e.target.value)} + placeholder="Enter team code" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + /> + + +
    +
    -
    - { - (!blockInvites) && - } + )}
    - } +

    Update your profile

    -
    - +
    setName(e.target.value)} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> -
    -
    - +
    setUsn(e.target.value)} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> -
    @@ -411,35 +652,35 @@ const ProfileSection = () => { className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500 resize-y" rows="5" > -
    -
    - +
    setOldPass(e.target.value)} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> +
    -
    - +
    setNewPass(e.target.value)} - className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" + className="w-full px-3 py-2 pl-10 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500" /> -