Démarrez de nouveaux projets plus rapidement: 10 outils de développement Web Scaffolding

Dans cet article, je vais vous présenter une liste de 10 bibliothèques pour vous aider à démarrer plus rapidement de nouveaux projets. La plupart d'entre nous, ici chez SitePoint, avons du mal à résister à un nouveau dépôt, et nous voulions voir si nous pouvions restreindre la boîte à outils idéale pour le développeur enclin aux projets.

Si vous êtes le genre de développeur qui aime tirer créez souvent de nouveaux projets, mettez-les au monde et voyez s'ils flottent (validation, comme pourrait l'appeler votre ami du marketing), alors vous avez besoin d'une boîte à outils. Bien sûr, si vous créez quelque chose de nouveau à votre rythme une fois par an, l'apprentissage de ces outils vous coûtera probablement du temps – celui-ci n'est pas pour vous. Mais si vous perdez tout intérêt, vous avez compris si la page d'accueil sera présentée dans une ou trois colonnes, vous avez besoin de toute l'aide que vous pouvez obtenir.

J'ai sélectionné les outils dans cet article pour leur capacité à vous aider. de zéro à héros en aussi peu de temps que possible. Étant donné que l'objectif ici est d'amorcer rapidement votre projet, j'ai également inclus non seulement des bibliothèques, mais également toutes sortes d'outils qui excellent pour fournir un échafaudage rapide et un avantage considérable en termes de vitesse. J'ai fait une sélection pour couvrir différents aspects d'un projet – vous pourriez en utiliser quelques-uns ensemble pour un combo gagnant.

Meteor est un framework JavaScript complet pour créer des applications Web et mobiles.

Nous ne peut pas parler de rapide sans le mentionner. Meteor est le roi du jeûne. Il vous lie à ses règles et à sa manière de faire les choses, mais si vous voulez sortir un prototype le plus tôt possible, Meteor vous soutiendra.

[19659003] L'une des grandes fonctionnalités de Meteor est ses capacités de code partagé serveur-client. Cela vous fait gagner beaucoup de temps et vous aide à vous concentrer sur ce qui est vraiment important.

Il est également livré avec MongoDB et l'intégration de WebSockets dès la sortie de la boîte.

Sails est un modèle-vue-contrôleur Web cadre d'application. Cela réduit les frictions pour les développeurs qui sont déjà familiarisés avec d'autres frameworks MVC indépendamment de la langue ou de la plate-forme.

Ce qui rend Sails.js unique est la façon dont il simplifie le processus de création d'applications Web régulières et modernes avec sa couche d'accès aux données simplifiée – qui est Agnostique de la base de données – et plans d'API REST qui génèrent des itinéraires et des actions en fonction de la conception de votre application.

Entre autres, il offre une sécurité de base et un contrôle d'accès basé sur les rôles , et une intégration WebSockets prête à l'emploi, ce qui en fait un excellent choix pour les applications en temps réel.

Si vous utilisez MongoDB, vous devriez profiter de son fidèle compagnon, Mongoose. Cette bibliothèque vous aide à modéliser facilement vos données dans des schémas, et elle vous aide à la transtypage et à la validation, entre autres. C'est une manière brillante d'éliminer beaucoup de passe-partout qui vous entraînerait autrement.

On pourrait dire que celui-ci est un un, étant donné que cela implique l'utilisation de MongoDB, ce qui est un choix fantastique que vous utilisiez Mongoose ou non. MongoDB est… eh bien, permettez-moi de citer leur site Web:

MongoDB est une base de données distribuée à usage général, basée sur des documents, conçue pour les développeurs d'applications modernes et pour l'ère du cloud.

Et pour conclure, ils ajoutent :

Aucune base de données ne vous rend plus productif.

Et voilà. De quoi d'autres avez-vous besoin? Arrêtez de tergiverser et commencez à coder!

Lodash fournit un ensemble d'outils pratiques pour rendre votre vie quotidienne de codage plus confortable. Il vous assiste dans l'itération, l'ordre, la limitation, le débouncing et probablement toute fonction que vous finiriez par lancer dans un fichier utils.

Un aspect vraiment cool de Lodash, c'est que toutes ses fonctions peuvent être importées ou même installées séparément. Inutile d'encombrer vos bundles avec du code inutile.

Si vous avez juste besoin de la fonction d'accélérateur, vous pouvez le faire:

 npm   install  lodash / throttle

Si vous pensez que vous utilisez peut-être quelques-unes des fonctions Lodash mais que vous ne savez pas lesquelles, et que vous ne voulez pas avoir à installer chacune séparément, vous pouvez les importer comme suit:

 import  accélérateur de  'lodash / throttle' 

De cette façon, le reste de la bibliothèque ne sera pas inclus dans votre bundle, et vous pourrez vivre heureux pour toujours.

Svelte est un framework front-end relativement nouveau qui crée beaucoup de battage médiatique depuis un certain temps maintenant , et pour une bonne raison. Il est si facile à utiliser que votre petit neveu pourrait vous voler votre travail si vous lui exposez votre travail. Je ne plaisante pas; c'est un framework minimaliste, sans BS, qui vous fera vous demander pourquoi il est devenu si complexe de construire des frontaux en premier lieu.

Ne vous méprenez pas: écrire du code front-end sera toujours compliqué, mais pas pour les mauvaises raisons. Si c'est là que nous mène l'avenir du développement Web, je suis impatient de voir la suite.

Svelte est réactif par défaut. Pas besoin de bibliothèques de gestion d'état compliquées ou de Virtual DOM et tout le reste. Il ne s’exécute même pas dans le navigateur. Il compile votre code dans un petit fichier JavaScript vanille optimisé, et c'est ce que le navigateur exécute. Alors, voilà: en plus d'être super facile à utiliser, c'est aussi génial.

Vérifiez les exemples sur leur site Web si vous ne me croyez pas.

Avant Svelte, Vue.js était définitivement mon premier choix pour le le framework frontal le plus simple. Et il peut encore tenir bon dans cette arène contre le reste de ses concurrents. Vue.js a l'avantage d'être mature et fiable. Il a eu du mal à gagner la confiance de l'industrie au début, mais nous sommes maintenant à un point où personne ne peut affirmer que Vue.js a gagné sa juste place au pôle.

Mais ce pour quoi nous sommes ici n'est pas Vue.js en soi mais la CLI Vue. C'est de loin le moyen le plus rapide de démarrer un projet avec Vue.js. Il prend en charge tous les tracas et la complexité de la configuration de votre environnement et vous permet d'écrire directement du code.

Ce que j'aime à ce sujet, c'est sa prise en charge prête à l'emploi pour TypeScript et Unity Testing, et la cerise sur le gâteau En haut, vous n'avez pas besoin «d'éjecter» votre application pour effectuer des configurations dans l'environnement. C'est une garantie de support à long terme imbattable que son concurrent le plus proche ne peut offrir.

Un concurrent proche de Vue CLI dans l'arène «rapide» est certainement Create React App, mieux connu sous le nom de CRA. La mise en route est très rapide, et si vous connaissez déjà React, cela pourrait être un meilleur choix pour vous.

CRA est activement maintenu, et son objectif est de maintenir votre environnement à jour en douceur. Le seul inconvénient est que si vous avez besoin de personnaliser votre environnement, vous devrez généralement «éjecter» votre application pour exposer la configuration du pack Web. Dès que vous faites cela, l'équipe de l'ARC ne fournira plus d'assistance, étant donné que vous n'auriez plus d'application d'ARC.

Pourtant, à moins que vous n'essayiez de créer quelque chose qui repose sur une configuration particulière, vous ' Vous n'aurez probablement jamais besoin de «s'éjecter».

Si vous construisez quelque chose qui nécessite la 3D dans le navigateur, alors Three.js est votre ami. Il est très facile à utiliser, a une grande communauté et a autant de contributeurs que d'étoiles dans le ciel. Three.js simplifie WebGL.

Three.js est une bibliothèque de rendu légère qui peut être facilement intégrée à la plupart des projets, ce qui en fait mon premier choix pour WebGL. Vous devriez vérifier les projets présentés sur leur site Web pour vous inspirer. La 3D sur le Web ne doit pas être réservée aux jeux. Vous pouvez apporter une toute nouvelle dimension à l’expérience de votre client.

Permettez-moi de vous montrer quelques-uns de mes favoris:

Et voici un bonus, un clip vidéo:

Besoin d’animations 2D agréables et fluides? Pixi est un moteur de création HTML5 avec un moteur de rendu WebGL 2D ultra-rapide.

C'est super simple à utiliser, et vous devriez consulter leur galerie pour voir la pléthore de choses intéressantes que vous pouvez créer. Si l'un d'entre eux ressemble à ce que vous essayez de réaliser, cette bibliothèque vous aidera à démarrer votre projet.

Ne vous méprenez pas, j'adore webpack, mais si vous sentez que vous en avez assez fichiers de configuration compliqués, vous n'êtes pas seul dans ce monde. Parcel est un bundler qui fonctionne hors de la boîte sans avoir besoin de configuration. Vous pouvez le personnaliser si nécessaire, mais le fait est que vous n’avez pas à le faire. La valeur par défaut est parfaite pour que votre projet soit opérationnel.

Conclusion

Comme nous l'avons vu, il n'y a pas de solution unique mais, espérons-le, vous ' J'ai trouvé quelque chose dans cette liste qui convient à votre projet particulier. Je laisse de côté bien d’autres excellentes solutions. Mais comme je l’ai dit au départ, l’objectif, dans ce cas, n’est pas la maintenabilité ou l’évolutivité, mais la rapidité avec laquelle elles peuvent vous mettre en marche.

Construire quelque chose d’extraordinaire n’a pas besoin d’être trop difficile. Parfois, il s’agit simplement d’utiliser les bons outils.