Sélectionner une page

Vous ne pourrez devenir un grand développeur qu’en faisant des efforts. Imaginez un instant 🤔 — Vous ne pourrez jamais vous muscler en lisant beaucoup sur le sport 📖. Vous avez besoin d’aller à la salle de gym pendant des heures et de transpirer 🏋🏾! Le même concept s’applique également à la programmation.

Voici 8 projets formidables pour former vos muscles de codage! 💪🏾 Le but est de construire chaque application avec la technologie que vous préférez. Peu importe votre langage de programmation favoris, pas de soucis, utilisez ce que vous voulez!

Projet #1: Un clone de Trello


Clone de Trello par Indrek Lasn – Démo

Ce que vous apprendrez de la construction d’un clone de Trello:

  • Les routages
  • Glisser déposer
  • Créer de nouveaux objets (tableaux, listes, cartes)
  • Manipulation des entrées et validation
  • Chemin d’accès côté client: comment utiliser le stockage local, enregistrer les données sur le stockage local, lire les données à partir du stockage local.
  • Chemin d’accès côté serveur: comment utiliser les bases de données, enregistrer les données dans la base de données, lire les données de la base de données.

Voici un exemple de Repository fait avec React + Redux.

Projet #2: une interface d’administration utilisateur

Repository Github

Une simple application CRUD, idéal pour les fondamentaux. Ce que tu vas apprendre:

  • Créer des utilisateurs, gérer des utilisateurs,
  • Interagir avec une base de données: créer, lire, éditer, supprimer des utilisateurs.
  • Validation des entrées et comment travailler avec des formulaires

Projet #3: Traqueur de Cryptomonnaies (application mobile native)

Repository Github

Vous pourrez utiliser Swift, Objective-C, React Native, Java, Kotlin, etc. 😊

Ce que tu vas apprendre:

  • Comment fonctionnent les applications natives
  • Récupération de données à partir d’une API
  • Comment fonctionnent les mises en page natives
  • Comment travailler avec des simulateurs mobiles.

Utilisez cette API. N’hésitez pas à poster dans les commentaires si vous en trouvez un meilleur.
Dans le cas où vous êtes intéressé par la façon dont cela a été construit, j’écrirai un tutoriel dessus.

Projet #4: Paramètrez votre propre config Webpack de zéro

Techniquement, ce n’est pas une application, mais il est toujours extrêmement utile de comprendre comment fonctionne webpack de l’intérieur. Ce ne sera plus une “boîte noire” mais un outil puissant à portée de main.

Pré-requis:

  • Compiler es7 en es5. (notions de base)
  • Compiler jsx en js  — ou — .vue en .js (vous en apprendrez plus sur les loaders)
  • Configurer le serveur de développement du webpack et  le hot module reloading. (vue-cli et create-react-app utilisez les deux)
  • Préparer une production prête à l’emploi et déployez-la à l’aide de Heroku, now.sh ou Github (vous apprendrez à déployer les projets webpack)
  • Configurer votre préprocesseur favori pour le compiler en css-scss, less, stylus.
  • Apprendre à utiliser des images et des svgs avec webpack.

Projet #5: un clone de Hackernews

Tout le monde a construit sa propre version de hacker news – ne soyons pas une exception.

Ce que vous apprendrez:

  • Interagir avec l’API hackernews
  • Création d’applications à une seule page
  • Comment implémenter des fonctionnalités telles que l’affichage des commentaires, des commentaires uniques, des profils.
  • Routage

Voici la documentation de l’API Hacker News.

Projet #6: une Todo App

TodoMVC

Vraiment? Une application todo? 🌚 Combien y en a-t-il déjà? Oui je sais. 😌 Mais écoutez-moi: il y a sûrement une raison pour laquelle ils sont si populaires.

Une Todo app est un excellent moyen d’assurer les fondamentaux. Essayez de le construire avec du JavaScript Vanilla et ensuite avec votre framework/bibliothèque préféré.

Ce que tu vas apprendre:

  • Créer de nouvelles tâches
  • Champs de validation
  • Filtrage des tâches (terminé, actif, tous). Faire usage de filtre et réduire les fonctions.
  • Comprendre les fondamentaux de Javascript.

Projet #7: Une liste de glisser-déposer filtrable

Repository Github

Très utile pour comprendre l’API glisser-déposer. Et vous permet de vous démarquer si vous êtes capable de créer des applications complexes.

Ce que tu vas apprendre:

  • Maîtriser l’API glisser et déposer
  • Créer des interfaces utilisateur riches

Projet #8: Un clone de Messenger (App native)

Comprendre à la fois le fonctionnement des applications natives et des applications Web vous permettra de vous démarquer facilement des autres développeurs.

Ce que tu vas apprendre:

  • Les Sockets Web (messagerie instantanée)
  • Comment fonctionnent les applications natives
  • Comment les layouts fonctionnent en natif.
  • Le routage pour les applications natives

••••••

Ceci devrait vous occuper pendant un mois ou deux, choisissez quelque chose et construisez-le! ✊🏾 Vous pouvez le faire!

TheGalsenGeek🇸🇳👨🏾‍💻

Partagez cet article: