8 educatieve projecten

“Een meester maakt meer fouten dan een beginner pogingen doet”

Wij bieden 8 projectopties die u “voor de lol” kunt doen om echte ontwikkelingservaring op te doen.

Project 1. Trello-kloon

Trello-kloon van Indrek Lasn.

Wat je gaat leren:

• Organisatie van aanvraagverwerkingsroutes (Routing).
• Slepen en neerzetten.
• Hoe nieuwe objecten te maken (borden, lijsten, kaarten).
• Verwerken en controleren van invoergegevens.
• Vanaf de clientkant: hoe u lokale opslag gebruikt, hoe u gegevens opslaat in de lokale opslag, hoe u gegevens uit de lokale opslag leest.
• Van de serverkant: hoe databases te gebruiken, hoe gegevens in de database op te slaan, hoe gegevens uit de database te lezen.

Hier is een voorbeeld van een opslagplaats, gemaakt in React+Redux.

Project 2. Beheerderspaneel

Github-opslagplaats.

Een eenvoudige CRUD-applicatie, ideaal om de basis te leren. Laten we leren:

• Gebruikers aanmaken, gebruikers beheren.
• Communiceer met de database - maak, lees, bewerk en verwijder gebruikers.
• Invoer valideren en werken met formulieren.

Project 3. Cryptocurrency-tracker (native mobiele applicatie)

Github-opslagplaats.

Alles: Swift, Objective-C, React Native, Java, Kotlin.

Laten we studeren:

• Hoe native applicaties werken.
• Gegevens ophalen uit de API.
• Hoe native pagina-indelingen werken.
• Hoe te werken met mobiele simulatoren.

Probeer deze API. Als je iets beters vindt, schrijf dan in de reacties.

Als je geïnteresseerd bent, hier is het hier is een tutorial.

Project 4. Zet uw eigen webpack-configuratie helemaal opnieuw op

Technisch gezien is dit geen applicatie, maar het is een zeer nuttige taak om te begrijpen hoe webpack van binnenuit werkt. Nu zal het geen ‘black box’ zijn, maar een begrijpelijk instrument.

vereisten:

• Compileer es7 tot es5 (basis).
• Compileer jsx naar js - of - .vue naar .js (je zult laders moeten leren)
• Stel de webpack-ontwikkelserver en het herladen van de hot-module in. (vue-cli en create-react-app gebruiken beide)
• Gebruik Heroku, now.sh of Github en leer hoe u webpack-projecten kunt implementeren.
• Stel uw favoriete preprocessor in om css te compileren - scss, less, stylus.
• Leer hoe u afbeeldingen en SVG's kunt gebruiken met webpack.

Dit is een geweldige bron voor complete beginners.

Project 5. Hackernews-kloon

Elke Jedi is verplicht zijn eigen Hackernews te maken.

Wat je onderweg leert:

• Hoe te communiceren met de hackernews-API.
• Hoe u een toepassing met één pagina maakt.
• Hoe u functies kunt implementeren zoals het bekijken van opmerkingen, individuele opmerkingen en profielen.
• Organisatie van aanvraagverwerkingsroutes (Routing).

Project 6. Tudushechka

TodoMVC.

Ernstig? Toedoesjka? Er zijn er duizenden. Maar geloof me, er is een reden voor deze populariteit.
De Tudu-app is een geweldige manier om ervoor te zorgen dat u de basisbeginselen begrijpt. Probeer één applicatie in standaard Javascript te schrijven en één in je favoriete framework.

Leren:

• Creëer nieuwe taken.
• Controleer of de velden zijn ingevuld.
• Filter taken (voltooid, actief, alles). Gebruik filter и reduce.
• Begrijp de basisprincipes van Javascript.

Project 7. Sorteerbare drag-and-drop-lijst

Github-opslagplaats.

Zeer nuttig om te begrijpen API slepen en neerzetten.

Laten we leren:

• API voor slepen en neerzetten
• Creëer rijke gebruikersinterfaces

Project 8. Messenger-kloon (native applicatie)

Je begrijpt hoe zowel webapplicaties als native applicaties werken, waardoor jij je onderscheidt van de grijze massa.

Wat gaan we bestuderen:

• Websockets (instant messages)
• Hoe native applicaties werken.
• Hoe sjablonen werken in native applicaties.
• Het organiseren van aanvraagverwerkingsroutes in native applicaties.

Dit is genoeg voor je voor een maand of twee.

De vertaling werd uitgevoerd met de steun van het bedrijf EDISON-softwaredie professioneel bezig is het ontwikkelen van applicaties en websites in PHP ook voor grote klanten ontwikkeling van clouddiensten en mobiele applicaties in Java.

Bron: www.habr.com