Her er nogle appideer, du kan opbygge for at øge dine kodningsfærdigheder

Har du nogensinde ønsket at bygge noget, men du anede ikke, hvad du skulle gøre? Ligesom forfattere undertiden har "forfatterblok", gælder det også for udviklere.

Sammen med min ven Jim skabte vi en samling af applikationsideer, der skal løse dette problem en gang for alle!

Disse applikationer er:

  • fantastisk at forbedre dine kodningsfærdigheder
  • dejligt at eksperimentere med nye teknologier
  • fantastisk at blive tilføjet i din portefølje for at imponere din næste arbejdsgiver / klient
  • fantastisk at blive brugt som eksempler i tutorials (artikler eller videoer)
  • let at færdiggøre og også let udvides med nye funktioner

Dette er ikke kun en simpel liste over projekter, men en samling, der beskriver hvert projekt i tilstrækkelig detaljering, så du kan udvikle det fra bunden!

Hver projektspecifikation indeholder følgende:

  1. Et klart og beskrivende mål
  2. En liste over User Stories , som skal gennemføres (disse historier handle mere som en rettesnor end en tvungen liste over To-Do s . Du er velkommen til at tilføje dine egne funktioner, hvis du vil)
  3. En liste over bonusfunktioner, der forbedrer ikke kun basisprojektet, men også dine færdigheder på samme tid
  4. Alle ressourcer og links til at hjælpe dig med at finde det, du har brug for til at gennemføre projektet

Projekter

Alle projekter er opdelt i tre niveauer baseret på den viden og erfaring, der kræves for at gennemføre dem. Disse niveauer er:

  1. Begynder - Udviklere i de tidlige stadier af deres læringsrejse. Dem, der typisk er fokuseret på at skabe applikationer, der vender mod brugeren.
  2. Mellemliggende - Udviklere i en mellemliggende fase af læring og erfaring. De er komfortable i UI / UX ved hjælp af udviklingsværktøjer og bygger apps, der bruger API-tjenester.
  3. Avanceret - Udviklere, der har alle ovenstående og lærer mere avancerede teknikker som implementering af BackEnd-applikationer og databasetjenester.

Nedenfor finder du 5 projekter for hvert niveau ( i alt 15 ), men der er over 30 projekter (i øjeblikket) i dette GitHub-arkiv. Sørg for at tjekke det ud, da vi planlægger at tilføje flere projekter i fremtiden. Du er velkommen til at hjælpe! (Mere om dette i afsnittet Bidrag nedenfor?)

1. Noter App

Niveau: 1 - Begynder

Beskrivelse : Opret og gem dine noter til et senere formål!

Brugerhistorier

  • Brugeren kan oprette en note
  • Brugeren kan redigere en note
  • Brugeren kan slette en note
  • Når du lukker browservinduet, lagres noterne, og når brugeren vender tilbage, hentes dataene

Bonusfunktioner

  • Brugeren kan oprette og redigere en note i Markdown-format. Ved gemning konverteres Markdown til HTML
  • Brugeren kan se datoen, da han oprettede noten

Nyttige links og ressourcer

  • lokal opbevaring
  • Markdown Guide
  • Marked - En markdown-parser

Eksempel på projekt

2. Julelys

Niveau: 1 - Begynder

Beskrivelse : Julelys-applikationen er afhængig af dine udviklingstalenter for at skabe et fascinerende lysdisplay. Din opgave er at tegne syv farvede cirkler i træk og på baggrund af en timer ændre intensiteten af ​​hver cirkel. Når en cirkel lyses, vender sin forgænger tilbage til sin normale intensitet.

Dette simulerer effekten af ​​en række krusende lys, der ligner dem, der vises i juleferien.

Brugerhistorier

  • Brugeren kan trykke på en knap for at starte og stoppe displayet
  • Brugeren kan ændre tidsintervallet, der styrer ændringen i intensitet

Bonusfunktioner

  • Brugeren kan vælge den farve, der bruges til at udfylde hver cirkel
  • Brugeren kan angive intensitetsværdien
  • Brugeren kan ændre størrelsen på en hvilken som helst cirkel i rækken
  • Brugeren kan angive antallet af rækker, der skal medtages i displayet. Fra en til syv rækker kan vælges

Nyttige links og ressourcer

  • Prøvebillede
  • Adafruit LED Matrix

Eksempel på projekt

3. FlipImage

Niveau: 1 - Begynder

Beskrivelse : Det er vigtigt for webudviklere at forstå det grundlæggende ved at manipulere billeder, da rige webapplikationer er afhængige af billeder for at tilføje værdi til brugergrænsefladen og brugeroplevelsen (UI / UX).

FlipImage udforsker et aspekt af billedmanipulation - billedrotation. Denne app viser et firkantet panel, der indeholder et enkelt billede præsenteret i en 2x2 matrix. Ved hjælp af et sæt op, ned, venstre og højre pile ved siden af ​​hvert af billederne kan brugeren vende dem lodret eller vandret.

Du skal kun bruge native HTML, CSS og Javascript til at implementere denne app. Billedpakker og biblioteker er ikke tilladt.

Brugerhistorier

  • Brugeren kan se en rude, der indeholder et enkelt billede gentaget i en 2x2-matrix
  • Brugeren kan vende et hvilket som helst af billederne lodret eller vandret ved hjælp af et sæt op, ned, venstre og højre pile ved siden af ​​billedet

Bonusfunktioner

  • Brugeren kan ændre standardbilledet ved at indtaste URL'en til et andet billede i et indtastningsfelt
  • Brugeren kan vise det nye billede ved at klikke på knappen 'Vis' ud for indtastningsfeltet
  • Brugeren kan se en fejlmeddelelse, hvis den nye billed-URL ikke findes

Nyttige links og ressourcer

  • Sådan vendes et billede
  • Opret en CSS Flipping Animation

Eksempel på projekt

4. Quiz-app

Niveau: 1 - Begynder

Beskrivelse : Øv og test din viden ved at besvare spørgsmål i en quizapplikation.

Som udvikler kan du oprette en quizapplikation til test af kodningsfærdigheder hos andre udviklere. (HTML, CSS, JavaScript, Python, PHP osv ...)

Brugerhistorier

  • Brugeren kan starte quizzen ved at trykke på a button
  • Brugeren kan se et spørgsmål med 4 mulige svar
  • Når du har valgt et svar, skal du vise det næste spørgsmål til brugeren. Gør dette, indtil quizzen er afsluttet
  • I sidste ende kan brugeren se følgende statistikker:
  1. Det tog tid at afslutte quizzen
  2. Hvor mange korrekte svar fik han
  3. En besked, der viser, om han passedeller failedquizzen

Bonusfunktioner

  • Brugeren kan dele resultatet af en quiz på sociale medier
  • Tilføj flere quizzer til applikationen. Brugeren kan vælge, hvilken der skal tages
  • Brugeren kan oprette en konto og have alle scoringer gemt i sit dashboard. Brugeren kan gennemføre en quiz flere gange

Nyttige links og ressourcer

  • Åbn Trivia-database

Eksempel på projekter

Quiz-app bygget med React (vent på, at den indlæses, da den er hostet på Heroku)

5. Romertal til decimaltal Konverter

Niveau: 1 - Begynder

Beskrivelse : Det numeriske system, der er repræsenteret af romerske tal, stammer fra det gamle Rom og forblev den sædvanlige måde at skrive numre i hele Europa langt ud i senmiddelalderen. Romerske tal, som brugt i dag, anvender syv symboler, hver med en fast heltal.

Se nedenstående tabel Symbol - Værdipar:

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

Brugerhistorier

  • Brugeren skal være i stand til at indtaste et romersk nummer i et indtastningsfelt
  • Brugeren kunne se resultaterne i et enkelt outputfelt indeholdende decimal (base 10) svarende til det romerske tal, der blev indtastet ved at trykke på en knap
  • Hvis der er indtastet et forkert symbol, skal brugeren se en fejl

Bonusfunktioner

  • Brugeren kunne se, at konverteringen skulle foretages automatisk, når jeg skriver
  • Brugeren skal være i stand til at konvertere fra decimal til romersk (omvendt)

Nyttige links og ressourcer

  • En forklaring på romertal

Eksempel på projekt

Romersk talekonverter

6. Book Finder-app

Niveau: 2 - Mellemliggende

Beskrivelse : Opret et program, der giver brugerne mulighed for at søge efter bøger ved at indtaste en forespørgsel (titel, forfatter osv.). Vis de resulterende bøger på en liste på siden med alle de tilsvarende data.

Brugerhistorier

  • Brugeren kan indtaste en søgeforespørgsel i et inputfelt
  • Brugeren kan indsende forespørgslen. Dette kalder en API, der returnerer en række bøger med de tilsvarende data ( titel , forfatter , offentliggjort dato , billede osv.)
  • Brugeren kan se listen over bøger, der vises på siden

Bonusfunktioner

  • For hvert element på listen tilføjes et link, der sender brugeren til et eksternt sted, der har flere oplysninger om bogen
  • Implementere et responsivt design
  • Tilføj loading-animationer

Nyttige links og ressourcer

Du kan bruge Google Books API

Eksempel på projekt

BookSearch-React

7. Card-Memory-Game

Niveau: 2 - Mellemliggende

Beskrivelse : Korthukommelse er et spil, hvor du skal klikke på et kort for at se, hvilket billede der er under det og prøve at finde det matchende billede under de andre kort.

Brugerhistorier

  • Brugeren kan se et gitter med nxn-kort ( ner et heltal). Alle kort vender først ned ( hiddentilstand)
  • Brugeren kan klikke på en knap for at starte spillet. Når du klikker på denne knap, starter en timer
  • Brugeren kan klikke på et hvilket som helst kort for at afsløre det billede, der er under det (ændre det til visibletilstand). Billedet vises, indtil brugeren klikker på et andet kort

Når brugeren klikker på det andet kort:

  • Hvis der er en kamp, ​​vil de 2 kort blive fjernet fra spillet (enten skjule / fjerne dem eller lade dem være i visiblestaten)
  • Hvis der ikke er en kamp, ​​vender de 2 kort tilbage til deres oprindelige tilstand ( hiddentilstand)
  • Når alle kampene er fundet, kan brugeren se en dialogboks, der viser en tillykke-besked med en tæller, der viser den tid, det tog at færdiggøre spillet

Bonusfunktioner

  • Brug kan vælge mellem flere sværhedsgrader (let, medium, hård). Øget sværhedsgrad betyder: at reducere den tilgængelige tid til at fuldføre og / eller øge antallet af kort
  • Brugeren kan se spilstatistikken (antal gange han vandt / tabte, den bedste tid for hvert niveau)

Nyttige links og ressourcer

  • Wikipedia

Eksempel på projekter

Flip-korts hukommelsesspil

SMB3-hukommelseskortspil

8. Markdown Table Generator

Niveau: 2 - Mellemliggende

Beskrivelse : Opret et program, der konverterer en almindelig tabel med data leveret af brugeren (valgfrit) til en Markdown-formateret tabel.

Brugerhistorier

  • Brugeren kan oprette en HTML tablemed et givet antal rækker og kolonner
  • Brugeren kan indsætte tekst i hver celle i HTML table
  • Brugeren kan generere en Markdown formatted table, der indeholder data fraHTML table
  • Brugeren kan forhåndsvise Markdown formatted table

Bonusfunktioner

  • Brugeren kan kopiere den Markdown formatted tabletil udklipsholderen ved at trykke på en knap
  • Brugeren kan indsætte en ny række eller kolonne til et bestemt sted
  • Brugeren kan slette en række eller en kolonne helt
  • Brugeren kan justere (til venstre , højre eller center ) en celle , en kolonne , en række eller hele tabellen

Nyttige links og ressourcer

  • Markdown Guide
  • Marked - En markdown-parser
  • Sådan kopieres til udklipsholder

Eksempel på projekt

Tabeller Generator / Markdown Tabeller

9. String Art

Niveau: 2 - Mellemliggende

Beskrivelse : Formålet med String Art er at give udvikleren praksis med at skabe en simpel animeret grafik ved hjælp af geometri i animationsalgoritmen og skabe noget, der er visuelt behageligt at se.

String Art tegner en enkelt flerfarvet linje, som glider jævnt, indtil den ene ende berører en side af det lukkende vindue. På det tidspunkt berører den en "bounce" -effekt anvendes til at ændre retning.

En krusningseffekt oprettes ved kun at beholde 10–20 billeder af linjen, når den bevæger sig. Ældre billeder falder gradvist, indtil de forsvinder.

Animationsbiblioteker er ikke tilladt. Brug kun Vanilla HTML / CSS / JavaScript.

Brugerhistorier

  • Start med at tegne en flerfarvet linje i en tilfældig position inden for grænsen for det vedlagte vindue
  • Hver 20 ms tegner en ny kopi af linjen i en ny position baseret på en bane - den inkrementelle afstand fra den forrige linje baseret på slutpunkterne
  • Når et af linjens endepunkter berører grænsen for det lukkende vindue, skal du ændre dets retning og tilfældigt ændre dens vinkel
  • Gradvist falmer intensiteten af ​​gamle linjer, så kun de seneste 10-20 linjer er synlige for at skabe en følelse af bevægelse eller "krusning"

Bonusfunktioner

  • Brugeren kan angive linjens længde og dens hastighed
  • Brugeren kan angive flere linjer i vinduet, som alle bevæger sig langs forskellige baner og hastigheder

Nyttige links og ressourcer

  • Brug af flertrins animationer og overgange
  • Grundlæggende om animation

Eksempel på projekt

Dette projekt er meget tæt, men har et lille lukkende vindue og er monokromatisk. Daniel Cortes

10. Opgaveapp

Niveau: 2 - Mellemliggende

Beskrivelse : Den klassiske To-Do-applikation, hvor en bruger kan skrive ned alle de ting, han vil udføre.

Brugerhistorier

  • Brugeren kan se et inputfelt, hvor han kan skrive et opgaver
  • Ved at trykke på enter (eller en knap) kan brugeren indsende opgaveelementet og se, at det føjes til en liste over opgaver
  • Brugeren kan markere en opgave som completed
  • Brugeren kan fjerne et opgaveelement ved at trykke på en knap (eller på selve opgaveelementet)

Bonusfunktioner

  • Brugeren kan redigere en opgave
  • Brugeren kan se en liste med alle de udførte opgaver
  • Brugeren kan se en liste med alle de aktive opgaver
  • Brugeren kan se datoen, hvor han oprettede opgaven
  • Når du lukker browservinduet, gemmes opgaverne, og når brugeren vender tilbage, hentes dataene

Nyttige links og ressourcer

  • lokal opbevaring

Eksempel på projekter

Todo App bygget med React

11. Battleship Game Engine

Niveau: 3 - Avanceret

Beskrivelse : Battleship Game Engine (BGE) implementerer det klassiske turbaserede brætspil som en pakke, der er adskilt fra ethvert præsentationslag. Dette er en type arkitektonisk mønster, der er nyttig i mange applikationer, da det tillader et vilkårligt antal apps at bruge den samme service.

Selve BGE påberåbes gennem en række funktionsopkald snarere end gennem direkte koblede slutbrugerhandlinger. I denne henseende svarer brugen af ​​BGE til at bruge en API eller en række ruter eksponeret af en webserver.

Denne udfordring kræver, at du udvikler BGE og et meget tyndt, tekstbaseret præsentationslag til test, der er adskilt fra selve motoren. På grund af dette er nedenstående brugerhistorier opdelt i to sæt - et til BGE og et til det tekstbaserede præsentationslag.

BGE er ansvarlig for at opretholde spiltilstanden.

Brugerhistorier

BGE

  • Opkalderen kan påkalde en startGame()funktion for at starte et 1-spiller spil. Denne funktion genererer et 8x8 spilbræt bestående af 3 skibe med en bredde på en firkant og en længde på:
  1. Destroyer: 2 firkanter
  2. Cruiser: 3 firkanter
  3. Slagskib: 4 firkanter

startGame() vil tilfældigt placere disse skibe på tavlen i en hvilken som helst retning og returnere et array, der repræsenterer skibets placering.

  • Opkalderen kan påberåbe sig en shoot()funktion, der passerer målrækken og kolonnekoordinaterne for den målrettede celle på spillebrættet. shoot()returnerer indikatorer, der repræsenterer, hvis skuddet resulterede i et hit eller miss, antallet af skibe tilbage (dvs. endnu ikke sunket), skibets placeringsarray og opdaterede hits and misses-array.

Celler i arrayet hits og savner vil indeholde et mellemrum, hvis de endnu ikke er målrettet, Ohvis de blev målrettet, men ingen del af et skib var på det sted, eller Xhvis cellen var besat af en del af et skib.

Tekstbaseret præsentationslag

  • Brugeren kan se arrayet hits og savner vist som en 2-dimensionel karakterrepræsentation af spillebrættet, der returneres af startGame()funktionen.
  • Brugeren kan blive bedt om at indtaste koordinaterne for en målplads på spillebrættet.
  • Brugeren kan se opdaterede hits og savner array-display efter at have taget et skud.
  • Brugeren kan se en besked efter hvert skud, der angiver, om skuddet resulterede i et hit eller miss.
  • Brugeren kan se en lykønskningsmeddelelse efter skuddet, der synker det sidst tilbageværende skib.
  • Brugeren kan blive bedt om at spille igen i slutningen af ​​hvert spil. At afvise at spille igen stopper spillet.

Bonusfunktioner

BGE

  • Opkalderen kan angive antallet af rækker og kolonner i spillebrættet som en parameter til startGame()funktionen.
  • Opkalderen kan påberåbe sig en gameStats()funktion, der returnerer et Javascript-objekt, der indeholder metrics for det aktuelle spil. For eksempel antallet af turneringer, det aktuelle antal hits og misser osv.
  • Opkalderen kan angive antallet af spillere (1 eller 2), når de ringer, startGame()hvilket vil generere et bord for hver spiller, der er tilfældigt befolket med skibe.

shoot()vil acceptere det spillernummer, skuddet bliver lavet til sammen med skuddets koordinater. De data, den returnerer, er for den afspiller.

Tekstbaseret præsentationslag

  • Brugeren kan til enhver tid se den aktuelle spilstatistik ved at indtaste sætningen statsi stedet for målkoordinater. (Bemærk at dette kræver gameStats()funktionen i BGE)
  • Brugeren kan angive, at der skal spilles et to-spiller-spil, hvor hver spiller skifter om i samme terminalsession (Bemærk at dette kræver tilsvarende bonusfunktioner i BGE)
  • Brugeren kan se afspillernummeret i prompter tilknyttet inputne i hver tur.
  • Brugeren kan se begge spillere gå om bord i slutningen af ​​hver tur.

Nyttige links og ressourcer

  • Slagskibsspil (Wikipedia)
  • Battleship Game Rules (Hasbro)

Eksempel på projekter

Denne YouTube-video viser, hvordan et tekstbaseret slagskibsspil spilles.

Følgende eksempel gives som en demonstration af Battleship-spillet, hvis det ikke er kendt for dig. Husk, at du skal implementere et tekstbaseret præsentationslag til test. Battleship Game af Chris Brody

12. Chat-app

Niveau: 3 - Avanceret

Beskrivelse : Chatinterface i realtid, hvor flere brugere kan interagere med hinanden ved at sende beskeder.

Som en MVP (Minimum Viable Product) kan du fokusere på at opbygge chatgrænsefladen. Realtidsfunktionalitet kan tilføjes senere (bonusfunktionerne).

Brugerhistorier

  • Brugeren bliver bedt om at indtaste et brugernavn, når han besøger chatappen. Brugernavnet gemmes i applikationen
  • Brugeren kan se en, input fieldhvor han kan skrive en ny besked
  • Ved at trykke på entertasten eller ved at klikke på sendknappen vises teksten ved chat boxsiden af ​​sit brugernavn (f.eks. John Doe: Hello World!)

Bonusfunktioner

  • Beskederne vil være synlige for alle de brugere, der er i chatappen (ved hjælp af WebSockets)
  • Når en ny bruger slutter sig til chatten, vises en besked til alle eksisterende brugere
  • Beskeder gemmes i en database
  • Brugeren kan sende billeder, videoer og links, der vises korrekt
  • Brugeren kan vælge og sende en emoji
  • Brugere kan chatte privat
  • Brugere kan deltage channelsi bestemte emner

Nyttige links og ressourcer

  • Socket.io
  • Sådan oprettes en React.js chat-app på 10 minutter - artikel

Eksempel på projekt

Chatty2

13. GitHub-tidslinje

Niveau: 3 - Avanceret

Beskrivelse : API'er og grafisk gengivelse af information er kendetegnende for moderne webapplikationer. GitHub-tidslinje kombinerer de to for at skabe en visuel historie for brugernes GitHub-aktivitet.

Målet med GitHub-tidslinjen er at acceptere et GitHub-brugernavn og producere en tidslinje, der indeholder hver repo og kommenteret med repo-navne, den dato, de blev oprettet og deres beskrivelser. Tidslinjen skal være en, der kan deles med en potentiel arbejdsgiver. Det skal være let at læse og effektivt bruge farve og typografi.

Kun offentlige GitHub-repoer skal vises.

Brugerhistorier

  • Brugeren kan indtaste et GitHub-brugernavn
  • Brugeren kan klikke på knappen 'Generer' for at oprette og vise den navngivne brugers repo-tidslinje
  • Brugeren kan se en advarselsmeddelelse, hvis GitHub-brugernavnet ikke er et gyldigt GitHub-brugernavn.

Bonusfunktioner

  • Brugeren kan se et resumé af antallet af repoer optalt efter det år, de blev oprettet

Nyttige links og ressourcer

GitHub tilbyder to API'er, som du kan bruge til at få adgang til repodata. Du kan også vælge at bruge en NPM-pakke til at få adgang til GitHub API.

Dokumentation til GitHub API kan findes på:

  • GitHub REST API V3
  • GitHub GraphQL API V4

Eksempelkode, der viser, hvordan du bruger GitHub API'er, er:

Du kan bruge denne CURL-kommando til at se JSON returneret af V3 REST API til dine repos:

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

Eksempel på projekter

14. Stave-det

Niveau: 3 - Avanceret

Beskrivelse : At vide, hvordan man stave, er en grundlæggende del af at være flydende på ethvert sprog. Uanset om du er en ung, der lærer at stave, eller en person, der lærer et nyt sprog, er i stand til at øve, hjælper det med at styrke dine sprogfærdigheder.

Spell-It-appen hjælper brugerne med at øve deres stavning ved at afspille lydoptagelsen af ​​et ord, som brugeren derefter skal stave ved hjælp af computertastaturet.

Brugerhistorier

  • Brugeren kan klikke på knappen 'Afspil' for at høre det ord, der skal indtastes
  • Brugeren kan se bogstaver, der vises i tekstindtastningsordet, når de indtastes på tastaturet
  • Brugeren kan klikke på knappen 'Enter' for at indsende det ord, der er blevet skrevet i tekstindtastningsordet
  • Brugeren kan se en bekræftelsesmeddelelse, når det korrekte ord er skrevet
  • Brugeren kan se en meddelelse, der anmoder om, at ordet bliver skrevet igen, når det er stavet forkert
  • Brugeren kan se en oversigt over antallet af korrekte stavemåder, det samlede antal forsøgte ord og en procentdel af vellykkede poster.

Bonusfunktioner

  • Brugeren kan høre en bekræftelseslyd, når ordet er stavet korrekt
  • Brugeren kan høre en advarselslyd, når ordet er forkert stavet
  • Brugeren kan klikke på knappen 'Tip' for at fremhæve de forkerte bogstaver i tekstfeltet med indtastning af ord
  • Brugeren kan trykke på 'Enter' tasten på tastaturet for at indsende et indtastet ord eller klikke på 'Enter' knappen i appvinduet

Nyttige links og ressourcer

  • Texas Instruments tale og stave
  • Web Audio API
  • Klik og tal

Eksempel på projekter

Word Wizard til iOS

Tal N Spell på Google Play

15. Undersøgelses-app

Niveau: 3 - Avanceret

Beskrivelse : Undersøgelser er en værdifuld del af enhver udviklerens værktøjskasse. De er nyttige til at få feedback fra dine brugere om en række emner, herunder applikationstilfredshed, krav, kommende behov, problemer, prioriteter og bare forværringer for at nævne nogle få.

Undersøgelsesappen giver dig mulighed for at lære ved at udvikle en app med fuld funktion, som du kan føje til din værktøjskasse. Det giver mulighed for at definere en undersøgelse, give brugerne mulighed for at svare inden for en foruddefineret tidsramme og tabulere og præsentere resultater.

Brugere af denne app er opdelt i to forskellige roller, der hver har forskellige krav:

  • Undersøgelseskoordinatorer definerer og gennemfører undersøgelser. Dette er en administrativ funktion, der ikke er tilgængelig for normale brugere.
  • Undersøgelsesrespondenter Fuldfør undersøgelser og se resultater. De har ingen administrative rettigheder i appen.

Kommercielle undersøgelsesværktøjer inkluderer distributionsfunktionalitet, der masserer e-mail-undersøgelser til respondenter. For nemheds skyld antager denne app, at der er adgang til undersøgelser, der er åbne for svar, fra appens webside.

Brugerhistorier

Generel

  • Undersøgelseskoordinatorer og respondenter i undersøgelsen kan definere, gennemføre og se undersøgelser og undersøgelsesresultater fra et fælles websted
  • Undersøgelseskoordinatorer kan logge ind på appen for at få adgang til administrative funktioner som at definere en undersøgelse.

Definition af en undersøgelse

  • Undersøgelseskoordinator kan definere en undersøgelse, der indeholder 1–10 multiple choice-spørgsmål.
  • Undersøgelseskoordinator kan definere 1–5 gensidigt eksklusive valg til hvert spørgsmål.
  • Undersøgelseskoordinator kan indtaste en titel til undersøgelsen.
  • Undersøgelseskoordinator kan klikke på knappen 'Annuller' for at vende tilbage til hjemmesiden uden at gemme undersøgelsen.
  • Undersøgelseskoordinator kan klikke på knappen 'Gem' for at gemme en undersøgelse.

Gennemførelse af en undersøgelse

  • Undersøgelseskoordinator kan åbne en undersøgelse ved at vælge en undersøgelse fra en liste over tidligere definerede undersøgelser
  • Undersøgelseskoordinatorer kan lukke en undersøgelse ved at vælge den fra en liste over åbne undersøgelser
  • Undersøgelsesrespondent kan gennemføre en undersøgelse ved at vælge den fra en liste over åbne undersøgelser
  • Undersøgelsesrespondent kan vælge svar på undersøgelsesspørgsmål ved at klikke på et afkrydsningsfelt
  • Undersøgelsesrespondenter kan se, at et tidligere valgt svar automatisk ikke markeres, hvis der klikkes på et andet svar.
  • Undersøgelsesrespondenter kan klikke på knappen 'Annuller' for at vende tilbage til hjemmesiden uden at indsende undersøgelsen.
  • Undersøgelsesrespondenter kan klikke på knappen 'Send' og indsende deres svar til undersøgelsen.
  • Undersøgelsesrespondenter kan se en fejlmeddelelse, hvis der klikkes på 'Send', men ikke alle spørgsmål er blevet besvaret.

Visning af undersøgelsesresultater

  • Undersøgelseskoordinatorer og respondenter i undersøgelsen kan vælge den undersøgelse, der skal vises fra en liste over lukkede undersøgelser
  • Undersøgelseskoordinatorer og respondenter i undersøgelsen kan se undersøgelsesresultater som i tabelformat, der viser antallet af svar for hvert af de mulige valg til spørgsmålene.

Bonusfunktioner

  • Undersøgelsesrespondenter kan oprette en unik konto i appen
  • Undersøgelsesrespondenter kan logge ind på appen
  • Undersøgelsesrespondenter kan ikke udføre den samme undersøgelse mere end én gang
  • Undersøgelseskoordinatorer og respondenter i undersøgelsen kan se grafiske repræsentationer af undersøgelsesresultater (f.eks. Cirkeldiagram, søjle, kolonne osv. Diagrammer)

Nyttige links og ressourcer

Biblioteker til bygningsundersøgelser: SurveyJS

Nogle kommercielle undersøgelsestjenester inkluderer: Survey Monkey og Typeform

Eksempel på projekt

Bidrager

Du er velkommen til at bidrage til projektet i GitHub-arkivet! Ethvert bidrag er meget værdsat.

Du kan bidrage på to måder:

  1. opret et problem og fortæl os din idé. Sørg for, at du bruger den nye idéetiket i dette tilfælde;
  2. gaffel projektet og indsend en PR. Før du gør det, skal du sørge for at læse og følge Contribution Guide (du kan finde den i arkivet);

Tilføj dine egne eksempler

Du kan også tilføje dine egne eksempler til projekterne, når du har gennemført dem. Jeg opfordrer dig stærkt til at gøre dette, da det vil vise andre, hvilke fantastiske ting du har bygget! ?

Spred ordet!

Hvis oplysningerne fra denne artikel og fra repoen var nyttige for dig på nogen måde, skal du sørge for at give den en stjerne? På denne måde kan andre også finde den og få gavn! Sammen kan vi vokse og gøre vores samfund bedre!

Har du nogle forslag til, hvordan vi generelt kan forbedre dette projekt? Lad os vide! Vi vil meget gerne høre din feedback!

Hovedbidragere ??

Florin Pop : Twitter og hjemmeside.

Jim Medlock : Twitter og Medium

Ugentlig kodningsudfordring?

Som en bonus er der en ugentlig kodningsudfordring, hvor du kan lære mere ved at øve dine færdigheder på virkelige projekter. Læs den komplette guide for at finde ud af, hvordan du kan deltage! ?

Oprindeligt offentliggjort på www.florin-pop.com.