Íme néhány alkalmazásötlet, amelyet felépíthet a kódolási készségek szintjének emelésére

Szerettél volna már valamit építeni, de fogalmad sem volt, mit tegyél? Ahogy a szerzőknek néha „írói blokkja” van, a fejlesztőkre is igaz.

Jim barátommal közösen létrehoztunk egy alkalmazási ötletgyűjteményt, amelynek célja a probléma végleges megoldása!

Ezek az alkalmazások a következők:

  • nagyszerű javítani a kódolási képességeidet
  • nagyszerű kísérletezni az új technológiákkal
  • nagyszerű, hogy felkerül a portfólióba, hogy lenyűgözze a következő munkáltatóját / ügyfelét
  • kiválóan használható oktatóanyagok (cikkek vagy videók) példaként
  • könnyen kitölthető és új funkciókkal is könnyen bővíthető

Ez nem csak a projektek egyszerű listája, hanem egy olyan gyűjtemény, amely kellően részletesen leírja az egyes projekteket, így alapjaitól kezdve fejlesztheti azokat!

Minden projektspecifikáció a következőket tartalmazza:

  1. Világos és leíró cél
  2. A felhasználói történetek listája, amelyeket végre kell hajtani (ezek a történetek inkább útmutatóként szolgálnak, mint a teendők kényszerített listája. Ha akarja, bátran adjon hozzá saját funkciókat)
  3. A bónusz funkciók listája, amelyek nemcsak az alapprojektet, hanem a készségeit is javítják
  4. Minden erőforrás és link, amelyek segítenek megtalálni, amire szüksége van a projekt befejezéséhez

Projektek

Az összes projekt három szintre oszlik a teljesítésükhöz szükséges ismeretek és tapasztalatok alapján. Ezek a szintek:

  1. Kezdő - A fejlesztők a tanulási útjuk kezdeti szakaszában. Akik jellemzően a felhasználó felé fordított alkalmazások létrehozására koncentrálnak.
  2. Középfokú - Fejlesztők a tanulás és a tapasztalat köztes szakaszában. Kényelmesek a felhasználói felületen / felhasználói felületen, fejlesztő eszközöket használva, és API-szolgáltatásokat használó alkalmazásokat építenek.
  3. Haladó - olyan fejlesztők, akik rendelkeznek a fentiekkel, és olyan fejlettebb technikákat tanulnak, mint a BackEnd alkalmazások és az adatbázis-szolgáltatások megvalósítása.

Az alábbiakban 5 projektet talál az egyes szintekhez ( összesen 15 ), de ebben a GitHub-tárházban (jelenleg) több mint 30 projekt található. Győződjön meg róla, hogy megnézte, mivel a jövőben további projektek felvételét tervezzük. Szívesen segítünk! (További információ erről az alábbi Hozzászólás részben található?)

1. Jegyzetek App

Szint: 1 - Kezdő

Leírás : Hozzon létre és tároljon jegyzeteket későbbi célokra!

Felhasználói történetek

  • A felhasználó létrehozhat jegyzetet
  • A felhasználó szerkeszthet egy jegyzetet
  • A felhasználó törölhet egy jegyzetet
  • A böngészőablak bezárásakor a jegyzetek tárolódnak, és amikor a Felhasználó visszatér, az adatok lekérésre kerülnek

Bónusz funkciók

  • A felhasználó létrehozhat és szerkeszthet egy jegyzetet Markdown formátumban. Mentéskor a Markdown-t HTML-vé konvertálja
  • A felhasználó láthatja a jegyzet létrehozásának dátumát

Hasznos linkek és források

  • helyi raktár
  • Markdown Guide
  • Marked - Markdown értelmező

Példa projektre

2. Karácsonyi fények

Szint: 1 - Kezdő

Leírás : A Christmas Lights alkalmazás a fejlesztői tehetségekre támaszkodva hoz létre hipnotizáló fénykijelzőt. Az Ön feladata, hogy hét színes kört rajzoljon egymás után, és az időzítő alapján változtassa meg az egyes körök intenzitását. Amikor egy kör világosodik, elődje visszatér normális intenzitására.

Ez szimulálja a hullámzó láncok hatását, hasonlóan a karácsonyi ünnepek alatt megjelenő fényekhez.

Felhasználói történetek

  • A felhasználó megnyomhat egy gombot a kijelző elindításához és leállításához
  • A felhasználó megváltoztathatja az intenzitás változásának időintervallumát

Bónusz funkciók

  • A felhasználó kiválaszthatja az egyes körök kitöltéséhez használt színt
  • A felhasználó megadhatja az intenzitás értékét
  • A felhasználó megváltoztathatja a sor bármelyik körének méretét
  • A felhasználó megadhatja a megjelenítendő sorok számát. Egy-hét sor választható

Hasznos linkek és források

  • Képminta
  • Adafruit LED Matrix

Példa projektre

3. FlipImage

Szint: 1 - Kezdő

Leírás : Fontos, hogy a webfejlesztők megértsék a képek manipulálásának alapjait, mivel a gazdag webalkalmazások a képekre támaszkodva adnak hozzá értéket a felhasználói felülethez és a felhasználói élményhez (UI / UX).

A FlipImage a képmanipuláció egyik aspektusát - a képforgatást - tárja fel. Ez az alkalmazás egy négyzet alakú panelt jelenít meg, amely egyetlen képet tartalmaz, 2x2-es mátrixban. Az egyes képek melletti fel, le, bal és jobb nyilak segítségével a felhasználó függőlegesen vagy vízszintesen elfordíthatja azokat.

Az alkalmazás megvalósításához csak natív HTML-t, CSS-t és Javascript-et kell használnia. Képcsomagok és könyvtárak nem engedélyezettek.

Felhasználói történetek

  • A felhasználó láthatja az ablaktáblát, amely egyetlen képet tartalmaz, 2x2 mátrixban megismételve
  • A felhasználó bármelyik képet függőlegesen vagy vízszintesen elfordíthatja a kép melletti fel, le, bal és jobb nyilak használatával

Bónusz funkciók

  • A felhasználó megváltoztathatja az alapértelmezett képet, ha egy másik kép URL-jét írja be egy beviteli mezőbe
  • A felhasználó a beviteli mező mellett található "Megjelenítés" gombra kattintva jelenítheti meg az új képet
  • A felhasználó hibaüzenetet láthat, ha az új képek URL-je nem található

Hasznos linkek és források

  • Kép megfordítása
  • Hozzon létre CSS Flipping Animációt

Példa projektre

4. Kvíz alkalmazás

Szint: 1 - Kezdő

Leírás : Gyakorold és teszteld tudásodat a kérdések megválaszolásával egy kvízalkalmazásban.

Fejlesztőként létrehozhat egy kvíz alkalmazást más fejlesztők kódolási képességeinek tesztelésére. (HTML, CSS, JavaScript, Python, PHP stb.)

Felhasználói történetek

  • A felhasználó az a megnyomásával elindíthatja a vetélkedőt button
  • A felhasználó 4 kérdést válaszolhat meg
  • A válasz kiválasztása után jelenítse meg a következő kérdést a Felhasználó előtt. Tedd ezt addig, amíg a kvíz befejeződik
  • Végül a Felhasználó a következő statisztikákat láthatja:
  1. A vetélkedő befejezéséhez szükséges idő
  2. Hány helyes választ kapott
  3. Egy üzenet, amely megmutatja, hogy ő passedvagy faileda kvíz

Bónusz funkciók

  • A felhasználó megoszthatja a kvíz eredményét a közösségi médiában
  • Adjon hozzá több vetélkedőt az alkalmazáshoz. A felhasználó kiválaszthatja, hogy melyiket vegye
  • A felhasználó létrehozhat egy fiókot, és az összes pontszámot elmentheti az irányítópultjára. A felhasználó többször is kitölthet egy kvízt

Hasznos linkek és források

  • Nyissa meg a Trivia adatbázist

Példa projektek

Kvíz alkalmazás, amelyet a React fejlesztett ki (várja meg, amíg betöltődik, ahogy a Heroku tárolja)

5. Római szám decimális szám átalakító

Szint: 1 - Kezdő

Leírás : A római számokkal ábrázolt numerikus rendszer az ókori Rómából származott, és egész Európában a késő középkorig a számok írásának szokásos módja maradt. A ma használt római számok hét szimbólumot tartalmaznak, amelyek mindegyike fix egész értékkel rendelkezik.

Lásd az alábbi táblázatot: Szimbólum - Érték párok:

  • I - 1
  • V - 5
  • X - 10
  • L - 50
  • C - 100
  • D - 500
  • M - 1000

Felhasználói történetek

  • A felhasználónak képesnek kell lennie egy római szám megadására egy beviteli mezőben
  • A felhasználó egyetlen kimeneti mezőben láthatta az eredményeket, amelyek tartalmazzák a gomb lenyomásával beírt római szám tizedesértékét (alap 10).
  • Helytelen szimbólum megadása esetén a Felhasználónak hibát kell látnia

Bónusz funkciók

  • A felhasználó láthatta, hogy az átalakítás automatikusan végrehajtódik, amikor gépelek
  • A felhasználónak képesnek kell lennie tizedesből római nyelvre konvertálni (fordítva)

Hasznos linkek és források

  • A római számok magyarázata

Példa projektre

Római szám átalakító

6. Könyvkereső alkalmazás

Szint: 2 - Középszintű

Leírás : Hozzon létre egy alkalmazást, amely lehetővé teszi a felhasználók számára, hogy lekérdezés (cím, szerző stb.) Segítségével könyveket keressenek. A kapott könyveket jelenítse meg az oldalon egy listában, az összes megfelelő adattal együtt.

Felhasználói történetek

  • A felhasználó beírhat egy keresési lekérdezést egy inputmezőbe
  • A felhasználó elküldheti a lekérdezést. Ez egy API-t fog hívni, amely egy sor tömböt ad vissza a megfelelő adatokkal ( cím , szerző , közzététel dátuma , kép stb.)
  • A felhasználó láthatja az oldalon megjelenő könyvek listáját

Bónusz funkciók

  • A lista minden eleméhez adjon hozzá egy linket, amely elküldi a felhasználót egy külső webhelyre, amely további információkat tartalmaz a könyvről
  • Válaszos kialakítás megvalósítása
  • Adjon hozzá animációkat

Hasznos linkek és források

Használhatja a Google Könyvek API-t

Példa projektre

BookSearch-React

7. Kártya-memória-játék

Szint: 2 - Középszintű

Leírás : A kártyamemória olyan játék, ahol rákattint egy kártyára, hogy megnézze, melyik kép van alatta, és megpróbálja megtalálni a megfelelő képet a többi kártya alatt.

Felhasználói történetek

  • A felhasználó láthat egy rácsot nxn kártyákkal ( negész szám). Az összes kártya eredetileg lefelé van ( hiddenállapot)
  • A felhasználó egy gombra kattintva elindíthatja a játékot. Ha erre a gombra kattint, egy időzítő elindul
  • A felhasználó bármelyik kártyára kattintva bemutathatja az alatta lévő képet (állásra változtathatja visible). A kép mindaddig megjelenik, amíg a felhasználó nem kattint egy 2. kártyára

Amikor a felhasználó rákattint a 2. kártyára:

  • Ha van egyezés, akkor a 2 kártya kiesik a játékból (vagy elrejti / eltávolítja, vagy visibleállapotban hagyja )
  • Ha nincs egyezés, akkor a 2 kártya visszaáll eredeti állapotába ( hiddenállapotába)
  • Ha az összes találatot megtalálta, a felhasználó láthat egy párbeszédpanelt, amely egy Gratulálok üzenetet mutat be, és egy számláló mutatja a játék befejezéséhez szükséges időt

Bónusz funkciók

  • A használat több nehézségi szint közül választhat (könnyű, közepes, kemény). A megnövekedett nehézség azt jelenti: a rendelkezésre álló idő csökkentése és / vagy a kártyák számának növelése
  • A felhasználó láthatja a játék statisztikáját (hányszor nyert / veszített, a legjobb idő minden szintre)

Hasznos linkek és források

  • Wikipédia

Példa projektek

Flip - kártya memória játék

SMB3 memóriakártya játék

8. Markdown Table Generator

Szint: 2 - Középszintű

Leírás : Hozzon létre egy alkalmazást, amely a Felhasználó által megadott adatokkal rendelkező (szokásos) táblákat konvertálja Markdown formátumú táblává.

Felhasználói történetek

  • A felhasználó létrehozhat HTML tableegy megadott számú sorral és oszloppal
  • A felhasználó beilleszthet szöveget a HTML table
  • A felhasználó létrehozhat egy Markdown formatted table, amely tartalmazza az adatokat aHTML table
  • A felhasználó megtekintheti a Markdown formatted table

Bónusz funkciók

  • A felhasználó Markdown formatted tableegy gombnyomással átmásolhatja a vágólapra
  • A felhasználó új sort vagy oszlopot szúrhat be egy megadott helyre
  • A felhasználó törölhet egy sor vagy egy oszlop teljesen
  • A felhasználó igazíthatja ( balra , jobbra vagy középre ) egy cellát , egy oszlopot , egy sort vagy az egész táblázatot

Hasznos linkek és források

  • Markdown Guide
  • Marked - Markdown értelmező
  • Hogyan lehet másolni a vágólapra

Példa projektre

Táblagenerátor / Markdown táblák

9. Vonós művészet

Szint: 2 - Középszintű

Leírás : A String Art célja, hogy a fejlesztőnek gyakorlást nyújtson egy egyszerű animált grafika létrehozásáról, az animációs algoritmus geometriájának felhasználásával, és vizuálisan kellemes nézegetésre.

A String Art egyetlen többszínű vonalat rajzol, amely simán mozog, amíg az egyik vége nem érinti a bezáró ablak egyik oldalát. Ezen a ponton megérinti a „visszapattanás” hatást, amelyet irányának megváltoztatására alkalmaznak.

Hullámhatás úgy jön létre, hogy a vonalon csak 10–20 képet tart meg mozgás közben. A régebbi képek fokozatosan halványulnak, amíg el nem tűnnek.

Az animációs könyvtárak nem engedélyezettek. Csak Vanilla HTML / CSS / JavaScript-t használjon.

Felhasználói történetek

  • Először rajzoljon egy többszínű vonalat véletlenszerű helyzetbe a körülvevő ablak határán belül
  • Minden 20 ms a vonal új példányát rajzolja egy új pályára, egy pálya alapján - az előző sortól növekményes távolság a végpontok alapján
  • Amikor a vonal bármelyik végpontja megérinti a bezáró ablak határát, változtassa meg annak irányát és véletlenszerűen változtassa meg a szögét
  • Fokozatosan elhalványítja a régi vonalak intenzitását, így csak a legfrissebb 10–20 vonal látható a mozgás vagy a „hullámzás” érzetének megteremtése érdekében

Bónusz funkciók

  • A felhasználó megadhatja a vonal hosszát és sebességét
  • A felhasználó megadhatja az ablakon belüli több vonalat, amelyek mind különböző pályák és sebességek mentén mozognak

Hasznos linkek és források

  • Többlépcsős animációk és átmenetek használata
  • Animáció alapjai

Példa projektre

Ez a projekt nagyon közel van, de van egy kis bezáró ablaka, és monokromatikus. Daniel Cortes

10. Tennivaló alkalmazás

Szint: 2 - Középszintű

Leírás : A klasszikus tennivaló alkalmazás, ahol a felhasználó felírhatja az összes elvégzendő dolgot.

Felhasználói történetek

  • A felhasználó láthat egy inputmezőt, ahová beírhat egy tennivalót
  • Az Enter (vagy egy gomb) megnyomásával a felhasználó elküldheti a tennivaló elemet, és láthatja, hogy ez felkerül a tennivalók listájára
  • A felhasználó tennivalót jelölhet completed
  • A felhasználó eltávolíthat egy tennivalót egy gomb (vagy maga a tennivaló) megnyomásával.

Bónusz funkciók

  • A felhasználó szerkesztheti a teendőket
  • A felhasználó megtekintheti az összes elvégzett teendő listáját
  • A felhasználó megtekintheti az összes aktív teendő listáját
  • A felhasználó láthatja a teendő létrehozásának dátumát
  • A böngészőablak bezárásakor a teendők tárolásra kerülnek, és amikor a Felhasználó visszatér, az adatok lekérésre kerülnek

Hasznos linkek és források

  • helyi raktár

Példa projektek

Todo App épült React

11. Csatahajó-motor

Szint: 3 - Haladó

Leírás : A Battleship Game Engine (BGE) a klasszikus körökön alapuló társasjátékot olyan csomagként valósítja meg, amely el van választva minden prezentációs rétegtől. Ez egy olyan építészeti minta, amely számos alkalmazásban hasznos, mivel tetszőleges számú alkalmazás számára lehetővé teszi ugyanazt a szolgáltatást.

Magát a BGE-t függvényhívások sorozatával hívják meg, nem pedig közvetlenül összekapcsolt végfelhasználói műveletek révén. Ebben a tekintetben a BGE használata hasonlít egy webszerver által kitett API vagy útvonal-sorozat használatához.

Ehhez a kihíváshoz meg kell fejlesztenie a BGE-t és egy nagyon vékony, szöveges prezentációs réteget a teszteléshez, amely elkülönül magától a motortól. Emiatt az alábbi felhasználói történetek két halmazra oszlanak - egy a BGE-re és egy a szöveges bemutató rétegre.

A BGE felelős a játék állapotának fenntartásáért.

Felhasználói történetek

BGE

  • A hívó meghívhat egy startGame()funkciót egy 1 fős játék megkezdéséhez. Ez a funkció létrehoz egy 8x8-as játéktáblát, amely 3 hajóból áll, amelyek egy négyzet szélességűek és hosszúak:
  1. Pusztító: 2 négyzet
  2. Cruiser: 3 négyzet
  3. Csatahajó: 4 négyzet

startGame() véletlenszerűen helyezi ezeket a hajókat a fedélzetre bármilyen irányba, és visszaad egy tömböt, amely a hajó elhelyezését képviseli.

  • A hívó meghívhat egy shoot()függvényt, amely átadja a céltábla célsorának és oszlopának koordinátáit. shoot()visszaadja a mutatókat, amelyek azt mutatják, hogy a lövés találatot vagy elmaradást eredményezett-e, a megmaradt (azaz még nem süllyesztett) hajók számát, a hajó elhelyezési tömbjét, valamint a frissített találatok és hiányzások tömbjét.

A találatok és hiányzások tömb sejtjei tartalmaznak helyet, ha még meg kell célozni őket, Oha megcélozták őket, de egy hajó egyetlen része sem volt ezen a helyen, vagy Xha a cellát egy hajó része foglalta el.

Szövegalapú prezentációs réteg

  • A felhasználó láthatja a találatok és hiányzások tömbjét, amely a játék által a játék által visszajuttatott játék dimenziójának karakteres ábrázolásaként jelenik meg startGame().
  • A felhasználót arra lehet kérni, hogy adja meg a céltábla koordinátáit a játéktáblán.
  • A felhasználó lövés után láthatja a frissített találatok és a hiányzó tömbök kijelzőjét.
  • A felhasználó minden lövés után láthat egy üzenetet, amely jelzi, hogy a lövés találatot vagy hiányt eredményezett-e.
  • A felhasználó láthatja a gratuláló üzenetet az utolsó hátralévő hajót elsüllyesztett lövés után.
  • A felhasználót minden játék végén felszólíthatjuk arra, hogy játsszon újra. Az újbóli elutasítás leállítja a játékot.

Bónusz funkciók

BGE

  • A hívó a startGame()funkció paramétereként megadhatja a játéktábla sorainak és oszlopainak számát .
  • A hívó meghívhat egy olyan gameStats()funkciót, amely egy Javascript objektumot ad vissza, amely az aktuális játék mutatóit tartalmazza. Például a lejátszott fordulatok száma, a találatok és a kihagyások aktuális száma stb.
  • A hívó híváskor megadhatja a játékosok számát (1 vagy 2), startGame()amely minden hajóhoz véletlenszerűen betöltött játékoshoz egy táblát generál.

shoot()elfogadja a lövéshez tartozó játékos számát és a lövés koordinátáit. A visszaadott adatok az adott játékosra vonatkoznak.

Szövegalapú prezentációs réteg

  • A felhasználó bármikor láthatja az aktuális játékstatisztikát, ha beírja a kifejezést statsa célkoordináták helyett. (Ne feledje, hogy ehhez gameStats()a BGE függvénye szükséges )
  • A felhasználó megadhatja, hogy kétjátékos játékot kell-e játszani, és mindegyik játékos váltakozva változik ugyanazon a terminálon (vegye figyelembe, hogy ehhez a BGE-nek megfelelő bónuszfunkciókra van szüksége)
  • A felhasználó minden körben láthatja a lejátszó számát a bemenetekhez társított utasításokban.
  • A felhasználó láthatja mindkét játékos deszkáját minden kör végén.

Hasznos linkek és források

  • Csatahajó játék (Wikipédia)
  • Csatahajó játékszabályai (Hasbro)

Példa projektek

Ez a YouTube-videó bemutatja, hogyan játszanak egy szöveges csatahajó-játékot.

A következő példa a Battleship játék bemutatásaként szolgál, ha ismeretlen az Ön számára. Ne feledje, hogy a teszteléshez szöveges bemutató réteget kell megvalósítania. Csatahajó játék, Chris Brody

12. Chat App

Szint: 3 - Haladó

Leírás : Valós idejű csevegőfelület, ahol több felhasználó üzenetek küldésével léphetnek kapcsolatba egymással.

MVP-ként (Minimum életképes termék) a Chat kezelőfelületének kiépítésére koncentrálhat. A valós idejű funkcionalitás később hozzáadható (a bónusz funkciók).

Felhasználói történetek

  • A felhasználót a felhasználónév megadására kéri, amikor meglátogatja a csevegőalkalmazást. A felhasználónév az alkalmazásban lesz tárolva
  • A felhasználó láthatja, hogy input fieldhová írhat új üzenetet
  • A gomb entermegnyomásával vagy a gombra sendkattintva a szöveg megjelenik chat boxa felhasználó neve mellett (pl. John Doe: Hello World!)

Bónusz funkciók

  • Az üzenetek minden felhasználó számára láthatók lesznek, akik a csevegőalkalmazásban vannak (a WebSockets használatával).
  • Amikor egy új felhasználó csatlakozik a csevegéshez, egy üzenet jelenik meg az összes meglévő felhasználó számára
  • Az üzeneteket egy adatbázis tárolja
  • A felhasználó küldhet képeket, videókat és linkeket, amelyek megfelelően jelennek meg
  • A felhasználó kiválaszthat és elküldhet egy hangulatjelet
  • A felhasználók privát módon beszélgethetnek
  • A felhasználók csatlakozhatnak channelsmeghatározott témákhoz

Hasznos linkek és források

  • Socket.io
  • A React.js csevegőalkalmazás 10 perc alatt történő elkészítése - cikk

Példa projektre

Beszélő2

13. GitHub idővonal

Szint: 3 - Haladó

Leírás : Az API-k és az információk grafikus ábrázolása a modern webalkalmazások jellemzője. A GitHub idővonal ötvözi a kettőt a felhasználói GitHub-tevékenység vizuális történetének létrehozásához.

A GitHub Timeline célja egy GitHub felhasználói név elfogadása, és egy olyan idővonal előállítása, amely tartalmazza az egyes repókat és a repo neveket, a létrehozásuk dátumát és leírásukat. Az idővonalnak olyannak kell lennie, amelyet meg lehet osztani a leendő munkáltatóval. Könnyen olvashatónak és hatékonyan használhatónak kell lennie a színeknek és a tipográfiának.

Csak a nyilvános GitHub repókat szabad megjeleníteni.

Felhasználói történetek

  • A felhasználó megadhat egy GitHub felhasználónevet
  • A felhasználó a "Generálás" gombra kattintva létrehozhatja és megjelenítheti a megnevezett felhasználó repó ütemtervét
  • A felhasználó figyelmeztető üzenetet láthat, ha a GitHub felhasználói név nem érvényes GitHub felhasználói név.

Bónusz funkciók

  • A felhasználó megtekintheti a repók számának összegzését a létrehozás éve szerint

Hasznos linkek és források

A GitHub két API-t kínál, amelyeket felhasználhat a repo adatok eléréséhez. Választhat egy NPM csomag használatát is a GitHub API eléréséhez.

A GitHub API dokumentációja a következő címen található:

  • GitHub REST API V3
  • GitHub GraphQL API V4

A GitHub API-k használatát bemutató példa kód:

Ezzel a CURL paranccsal megtekintheti a V3 REST API által a repóinak visszaadott JSON-t:

curl -u "user-id" //api.github.com/users/user-id/repos

Példa projektek

14. Varázslat

Szint: 3 - Haladó

Leírás : A helyesírás ismerete alapvető része annak, hogy folyékonyan beszéljünk bármilyen nyelven. Akár fiatal, akár helyesírást tanul, vagy az az ember, aki új nyelvet tanul, és képes gyakorolni, segít megszilárdítani nyelvtudását.

A Spell-It alkalmazás segít a felhasználóknak a helyesírás gyakorlásában egy olyan szó hangfelvételének lejátszásával, amelyet a felhasználónak a számítógép billentyűzetén kell betűznie.

Felhasználói történetek

  • A felhasználó a „Lejátszás” gombra kattintva hallhatja a beírandó szót
  • A felhasználó láthatja a szóbeviteli mezőben megjelenő betűket, amint beírják a billentyűzetre
  • A felhasználó az 'Enter' gombra kattintva elküldheti azt a szót, amelyet beírt a szövegbeviteli mezőbe
  • A felhasználó megerősítő üzenetet láthat, amikor a megfelelő szót beírja
  • A felhasználó újra láthatja azt az üzenetet, amelyben a szó begépelését kéri, ha helytelenül írják
  • A felhasználó láthatja a helyesírások számának, a megkísérelt szavak teljes számának és a sikeres bejegyzések százalékos számának egyezését.

Bónusz funkciók

  • A felhasználó megerősítő hangot hallhat, amikor a szó helyesen van írva
  • A felhasználó figyelmeztető hangot hall, ha a szót helytelenül írják
  • A felhasználó a 'Tipp' gombra kattintva kiemelheti a helytelen betűket a szóbeviteli mezőben
  • A felhasználó megnyomhatja a billentyűzet „Enter” gombját egy beírt szó elküldéséhez, vagy az alkalmazás ablakában kattintson az „Enter” gombra

Hasznos linkek és források

  • Texas Instruments Speak and Spell
  • Web Audio API
  • Kattintson és beszéljen

Példa projektek

Word Wizard iOS rendszerhez

Speak N Spell a Google Playen

15. Felmérés kb

Szint: 3 - Haladó

Leírás : A felmérések a fejlesztők eszköztárának értékes részét képezik. Hasznosak arra, hogy visszajelzést kapjanak a felhasználóktól különböző témákban, ideértve az alkalmazások elégedettségét, a követelményeket, a felmerülő igényeket, a kérdéseket, a prioritásokat és az egyszerű súlyosbodásokat, hogy csak néhányat említsünk.

A Survey alkalmazás lehetőséget nyújt a tanulásra egy teljes funkcionalitású alkalmazás kifejlesztésével, amelyet hozzáadhat az eszköztárához. Lehetővé teszi egy felmérés meghatározását, lehetővé teszi a felhasználók számára, hogy előre meghatározott időkereten belül válaszoljanak, és táblázatba foglalják és bemutathatják az eredményeket.

Az alkalmazás felhasználói két külön szerepre vannak felosztva, amelyek mindegyikének különböző követelményei vannak:

  • A felmérés koordinátorai felméréseket határoznak meg és végeznek. Ez egy normál felhasználók számára nem elérhető adminisztrációs funkció.
  • Felmérés válaszadói Teljesítsen felméréseket és tekintse meg az eredményeket. Nincsenek adminisztratív jogosultságaik az alkalmazáson belül.

A kereskedelmi felmérési eszközök tartalmazzák az olyan terjesztési funkciókat, amelyek tömegesen küldik el a felméréseket a felmérés válaszadóinak. Az egyszerűség kedvéért ez az alkalmazás feltételezi, hogy a válaszok céljából nyitott felmérések az alkalmazás weboldaláról lesznek elérhetők.

Felhasználói történetek

Tábornok

  • A felmérés koordinátorai és a felmérés válaszadói közös weboldalon határozhatják meg, hajthatják végre és tekinthetik meg a felméréseket és a felmérés eredményeit
  • A felméréskoordinátorok bejelentkezhetnek az alkalmazásba az adminisztratív funkciók eléréséhez, például egy felmérés meghatározásához.

Felmérés meghatározása

  • A felmérés koordinátora meghatározhat egy felmérést, amely 1–10 feleletválasztós kérdést tartalmaz.
  • A felmérés koordinátora 1–5 egymást kizáró választékot határozhat meg minden kérdéshez.
  • A felmérés koordinátora megadhatja a felmérés címét.
  • A felmérés koordinátora a „Mégse” gombra kattintva visszatérhet a kezdőlapra a felmérés mentése nélkül.
  • A felmérés koordinátora a „Mentés” gombra kattintva mentheti a felmérést.

Felmérés lebonyolítása

  • A felmérés koordinátora felmérést nyithat meg, ha kiválaszt egy felmérést a korábban meghatározott felmérések listájáról
  • A felmérés koordinátorai bezárhatnak egy felmérést, ha kiválasztják azt a nyílt felmérések listájából
  • Felmérés A válaszadó kitölthet egy kérdést, ha kiválasztja azt a nyílt felmérések listájából
  • A felmérés válaszadója a jelölőnégyzetre kattintva választhatja ki a felmérés kérdéseire adott válaszokat
  • A felmérés válaszadói láthatják, hogy egy korábban kiválasztott válasz automatikusan törlődik, ha egy másik válaszra kattint.
  • Felmérés A válaszadók a „Mégse” gombra kattintva visszatérhetnek a kezdőlapra a felmérés elküldése nélkül.
  • Felmérés A válaszadók a „Küldés” gombra kattintva elküldhetik válaszaikat a felméréshez.
  • A felmérés válaszadói hibaüzenetet láthatnak, ha a „Küldés” gombra kattintanak, de nem minden kérdésre válaszoltak.

A felmérés eredményeinek megtekintése

  • A felmérés koordinátorai és a felmérés válaszadói a lezárt felmérések listájából választhatják ki a megjeleníteni kívánt felmérést
  • A felmérés koordinátorai és a felmérés válaszadói táblázatos formátumban tekinthetik meg a felmérés eredményeit, feltüntetve a válaszok számát az egyes lehetséges választásokra a kérdésekre.

Bónusz funkciók

  • A felmérés válaszadói egyedi fiókot hozhatnak létre az alkalmazásban
  • Felmérés A válaszadók bejelentkezhetnek az alkalmazásba
  • Felmérés A válaszadók nem tölthetik ki ugyanazt a felmérést többször
  • A felmérés koordinátorai és a felmérés válaszadói megtekinthetik a felmérés eredményeinek grafikus ábrázolását (pl. Torta, oszlop, oszlop stb. Diagramok)

Hasznos linkek és források

Könyvtárak épületfelmérésekhez: SurveyJS

Néhány kereskedelmi felmérési szolgáltatás a következőket tartalmazza: Survey Monkey és Typeform

Példa projektre

Hozzájárulás

Szívesen közreműködünk a projektben a GitHub adattárban! Bármilyen hozzájárulást nagyra értékelünk.

Kétféle módon járulhat hozzá:

  1. hozzon létre egy kérdést, és mondja el ötletét. Ügyeljen arra, hogy ebben az esetben használja az új ötlet címkét;
  2. elágazik a projekt és benyújt egy PR-t. Mielőtt ezt megtenné, kérjük, győződjön meg róla, hogy elolvasta és betartotta a Contribution Guide-t (megtalálja a tárban);

Adjon hozzá saját példákat

Saját példákat is hozzáadhat a projektekhez, miután befejezte őket. Erősen bátorítalak erre, mert ez megmutatja másoknak, milyen csodálatos dolgokat építettél! ?

Terjeszd a hírt!

Ha az e cikkből és a repóból származó információk bármilyen szempontból hasznosak voltak számodra, akkor feltétlenül adj neki csillagot?, Így mások is megtalálhatják és hasznot húzhatnak! Együtt növekedhetünk és jobbá tehetjük közösségünket!

Van valami javaslata, hogyan javíthatnánk ezt a projektet összességében? Tudasd velünk! Örömmel halljuk visszajelzését!

Főbb közreműködők ??

Florin Pop : Twitter és weboldal.

Jim Medlock : Twitter és Medium

Heti kódolási kihívás?

Bónuszként van egy Heti Kódolási Kihívás, ahol többet tudhat meg, ha gyakorlatot gyakorol valós projekteken. Olvassa el a Teljes útmutatót, hogy megtudja, hogyan vehet részt! ?

Eredetileg a www.florin-pop.com címen jelent meg.