Przejdź do głównej zawartości

Pierwsze kroki: Uczeń

Witaj w Tutor IDE! Ten poradnik pomoże Ci zacząć przygodę z programowaniem — krok po kroku.

1. Zaloguj się​

Twój nauczyciel poda Ci login i hasło — wpisz je na stronie app.tutoride.dev i kliknij "Zaloguj się".

Jeśli nie masz nauczyciela, możesz też sam założyć konto — kliknij "Zarejestruj się" i wypełnij formularz.

2. Lista kontrolna onboardingu​

Przy pierwszym logowaniu zobaczysz listę kontrolną — to zestaw prostych kroków, które pomogą Ci poznać platformę. Każdy krok to krótkie zadanie, np. "Utwórz swój pierwszy projekt" albo "Rozwiąż pierwsze wyzwanie". Wykonuj je po kolei — to najszybszy sposób, żeby poczuć się pewnie na platformie.

Dashboard ucznia po pierwszym zalogowaniu — pasek postępu, poziom i XP, lista projektów

3. Dołącz do organizacji​

Jeśli Twój nauczyciel dał Ci kod zaproszenia, kliknij "Dołącz do organizacji" i wpisz kod. Zostaniesz automatycznie dodany do odpowiedniej grupy.

Jeśli nauczyciel sam utworzył Twoje konto, wszystko jest już gotowe — po zalogowaniu od razu jesteś w grupie.

4. Utwórz swój pierwszy projekt​

Na dashboardzie kliknij "Nowy projekt" i wybierz szablon:

  • HTML/CSS — tworzenie stron internetowych z kolorami, czcionkami i układem
  • HTML/CSS/JS — jak wyżej, ale z interaktywnymi elementami (animacje, przyciski, gry!)
  • Python — programowanie w języku Python (obliczenia, gry tekstowe, algorytmy)

Nadaj projektowi nazwę i kliknij "Utwórz". Otworzy się edytor kodu — tu zaczyna się zabawa!

5. Pisz kod i zobacz efekt​

Po lewej stronie widzisz edytor kodu — tu piszesz HTML, CSS lub JavaScript. Po prawej stronie widoczny jest podgląd — Twoja strona wyświetlana na żywo.

Każda zmiana, którą zapiszesz (Ctrl+S), natychmiast pojawi się w podglądzie. Eksperymentuj! Zmień kolor, dodaj nowy nagłówek, wstaw obrazek — i obserwuj, co się dzieje.

6. Poproś o pomoc asystenta AI​

Nie wiesz, jak coś zrobić? Kliknij ikonę czatu i zadaj pytanie asystentowi AI. Możesz zapytać na przykład:

  • "Jak zmienić kolor tła na niebieski?"
  • "Co to jest <div>?"
  • "Jak zrobić, żeby tekst był na środku strony?"

Asystent odpowie po polsku, prostym językiem, i pomoże Ci zrozumieć nowe rzeczy.

7. Rozwiązuj wyzwania​

W zakładce "Wyzwania" znajdziesz zadania przypisane przez nauczyciela. Każde wyzwanie to nowa umiejętność do opanowania.

Masz też dostęp do CSS Battle — specjalnych zadań, w których odwzorowujesz obrazek za pomocą kodu HTML i CSS. Im dokładniej, tym wyższy wynik!

8. Graj w mini-gry​

Przejdź do strony Learn (Nauka), aby znaleźć mini-gry edukacyjne. Każda gra ma trzy poziomy trudności:

  • Łatwy — dostępny od razu, idealny na start
  • Średni — odblokowany po zdobyciu przynajmniej 1 gwiazdki na poziomie łatwym
  • Trudny — odblokowany po zdobyciu przynajmniej 1 gwiazdki na poziomie średnim

System gwiazdek​

Za każdą grę możesz zdobyć od 0 do 3 gwiazdek:

  • 0 gwiazdek — wynik poniżej progu zaliczenia — spróbuj jeszcze raz!
  • 1 gwiazdka — zaliczone! Możesz odblokować kolejny poziom trudności
  • 2 gwiazdki — świetny wynik!
  • 3 gwiazdki — perfekcyjnie! Jesteś mistrzem tej gry

Granie w mini-gry daje Ci punkty XP, więc to świetny sposób na naukę i zdobywanie poziomów jednocześnie.

9. Podążaj ścieżkami nauki​

Ścieżki nauki (Learning Paths) to uporządkowany program, który prowadzi Cię przez kolejne tematy — od podstaw HTML, przez CSS, aż po zaawansowany JavaScript.

Każdy etap kończy się wyzwaniem-bramką — musisz je zaliczyć, żeby przejść do następnego etapu. Dzięki temu masz pewność, że dobrze rozumiesz każdy temat, zanim przejdziesz dalej.

10. Wykonuj codzienne questy​

Każdego dnia czekają na Ciebie codzienne questy — krótkie cele do zrealizowania, np.:

  • "Utwórz nowy projekt"
  • "Rozwiąż jedno wyzwanie"
  • "Zagraj w mini-grę"
  • "Zadaj pytanie asystentowi AI"

Wykonywanie questów pomaga Ci uczyć się regularnie i nagradza Cię dodatkowymi punktami XP. Sprawdzaj swoje codzienne cele na dashboardzie!

11. Opublikuj swój projekt​

Kiedy Twój projekt jest gotowy, kliknij "Opublikuj" w edytorze. Twoja strona pojawi się w internecie pod prawdziwym adresem, np.:

https://code.tutoride.dev/twoj-nick/moja-strona/

Możesz wysłać ten link rodzinie, znajomym lub pokazać na lekcji.

12. Zaproś rodziców​

Twoi rodzice mogą śledzić Twoje postępy! Na dashboardzie znajdziesz opcję wygenerowania linku dla rodzica. Wystarczy, że wyślesz go mamie lub tacie — po kliknięciu zobaczą Twoją aktywność, zdobyte osiągnięcia i postępy w nauce. Rodzice nie potrzebują własnego konta — link wystarczy.

13. Zdobywaj osiągnięcia i odznaki​

Na platformie czeka na Ciebie 44 osiągnięcia w 10 kategoriach — każde z unikalną odznaka z własną grafiką. Osiągnięcia zdobywasz za różne aktywności:

  • Pierwsze kroki — np. "Pierwszy projekt", "Pierwsza publikacja"
  • Wyzwania — np. "Mistrz CSS", "10 ukończonych wyzwań"
  • Mini-gry — np. "Gracz", "Kolekcjoner gwiazdek"
  • Seria aktywności — np. "7 dni z rzędu", "30-dniowa seria"
  • Społeczność — np. "Pomocny kolega", "Lider tygodnia"
  • ...i wiele więcej!

Sprawdź swoją kolekcję odznak na stronie Osiągnięcia w dashboardzie. Ile uda Ci się zdobyć?

14. Sprawdzaj swoje postępy​

Na dashboardzie znajdziesz informacje o swoich postępach:

  • Punkty XP — zdobywasz je za każdą aktywność na platformie
  • Poziom — im więcej XP, tym wyższy poziom
  • Osiągnięcia — 44 unikalne odznaki za różne dokonania
  • Gwiazdki — zbierane w mini-grach za wysokie wyniki
  • Seria — ile dni z rzędu byłeś aktywny

15. Sprawdź, kto prowadzi!​

Otwórz tabelę liderów, aby zobaczyć ranking uczniów w Twojej grupie. Kto zdobył najwięcej XP w tym tygodniu? Może to będziesz Ty!

Powodzenia! Programowanie to supermoc — a Ty właśnie zaczynasz ją odkrywać. Twórz, eksperymentuj, graj w mini-gry, zdobywaj gwiazdki i nie bój się pytać o pomoc.