маған 7,8 сыныпқа арналған интерактивті тақтамен ойналатын ойындар жасап бер. 7 сыныпқа 5 ойын,8 сыныпқа 5 ойын. Әр ойынды ойнаған кезде қанша рет ойналғаны көрініп тұрсын. Сонымен қатар,оқушылардың рейтингін тексеру үшін мұғалімдер панелі қосылсын,балаларының да үлгерімін тексеру үшін ата-ана панелі қосылсын. Оқушы қызығып ойнайтындай тапсырмалар болсыншы,өте жүйелі болсын информатика пәнінен санау жүйесі деген тақырыпқа
Мен сізге санау жүйесі тақырыбынан интерактивті ойындар платформасын жасаймын. Алдымен дизайн инспирациясын алып, содан кейін құрастырамын.
Енді оқулық ойындар платформасын құрастырамын. Бұл жүйеде 7-8 сыныпқа арналған санау жүйесі тақырыбынан интерактивті ойындар, мұғалім панелі, ата-ана панелі болады.
Енді жаңа тема мен барлық компоненттерді құрастырамын:
Енді беттерді құрастырайын:
Платформа дайын! Сізге информатика пәнінен санау жүйесі тақырыбына арналған толық интерактивті ойын платформасын жасадым:
7 сынып ойындары (5 ойын):
- Екілік түрлендіргіш - Ондық санды екілік санау жүйесіне түрлендіру
- Ондық жарыс - Уақытпен жарыса отырып екілік санды ондыққа түрлендіру
- Бит жұмбағы - Биттерді басып мақсатты санды жинау
- Сан сәйкестігі - Ондық және екілік жұптарды табу
- Бинарлық викторина - Екілік санау жүйесі бойынша тест
8 сынып ойындары (5 ойын):
- Он алтылық шебер - Он алтылық санау жүйесімен жұмыс
- Сегіздік түрлендіргіш - Сегіздік санау жүйесіне түрлендіру
- Жүйелер тізбегі - Бір жүйеден екіншісіне тізбекті түрлендіру
- Код бұзушы - ASCII кодтарды санау жүйелері арқылы шешу
- Жылдамдық сынағы - 90 секундта мүмкіндігінше көп түрлендіру
Мүмкіндіктер:
- Ойын санауышы - Әр ойын қанша рет ойналғанын көрсетеді
- Мұғалім панелі - Оқушылар рейтингі, статистика, ойын нәтижелері
- Ата-ана панелі - Балалар үлгерімі, апталық прогресс, ұсыныстар
- Жалпы рейтинг - 7 және 8 сынып бойынша үздік оқушылар тізімі
Енді барлық өзгертулерді жасаймын. Алдымен ашық көк фон, содан кейін 3D элементтерді, auth жүйесін және мұғалім панеліне оқушыларды басқару функцияларын қосамын:
Енді auth контекстін және пайдаланушы деректерін жасаймын:
Енді мұғалім панелін оқушыларды қосу/өшіру функциясымен жаңартамын:
Енді Navbar компонентін де жаңартайын:
Енді layout.tsx-ті AuthProvider-мен жаңартамын:
Енді ата-ана панелін де жаңартамын:
Енді мұғалім панелінің беті де auth қорғауы қажет:
Енді мұғалім панеліне auth қорғауын қосамын:
Енді UI компоненттерін тексерейін:
Керекті UI компоненттері бар. Енді браузерде тексерейін:
Auth беті жұмыс істеп тұр. Скриншот алайын:
Жақсы, бірақ фон қара түсті көрінеді. Бұл ашық көк болуы керек. CSS-ті тексерейін және түзетейін:
CSS дұрыс, бірақ скриншотта dark mode көрсетілген сияқты. Мүмкін браузерде dark mode қосылған. Мен демо аккаунтпен кіріп, мұғалім панелін тексерейін:
Жақсы, кіру жасалды және мұғалім ретінде көрінеді. Navbar-да да аты және рөл көрсетілген. 3D элементтер де көрінеді. Мұғалім панеліне өтейін:
React hooks қатесі бар - бұл useState шартты түрде шақырылғанға байланысты. Мұғалім панелінде hooks реттілігін түзетейін:
Мәселені көрдім - useState шақырулары шартты тексерулерден КЕЙІН орналасқан. Бұл React hooks ережесіне қарсы келеді. Барлық useState-тер компоненттің басында болуы керек:
Енді ата-ана панелінде де сол мәселені тексерейін:
Ата-ана панелінде useState жоқ, сондықтан ол дұрыс. Енді мұғалім панелін қайта тексерейін: