preloader

Le kit de survie pour le web

Le kit de survie pour le web
Par Nicolas Malet / Publié le 26.04.2020

Des tas de sites et services en ligne pour vous aider dans le développement front-end

Tu t’es enfin décidé à affronter les terres désolées du World Wide Web et tu veux franchir de nouvelles étapes. Tu as frappé à la bonne porte, je t’ai préparé de bons outils pour trouver ton chemin. La plupart des outils proposés sur cette page sont des applications web gratuites. Pour toi je les ai organisé par catégorie car on a peu de temps. C’est parti !

Gestion de projet

Hébergement gratuit

Attention hébergement gratuit ne veut pas dire qu’ils vont te faire un café mais tu pourras toujours trouver mieux contre quelques pièces.

Transférer des fichiers SFTP - SSH

  • filezilla-project.org Filezilla application de transfert de fichier utilisant le protocole SFTP
  • winscp.net Winscp application de transfert de fichier utilisant le protocole SFTP
  • Ou encore directement dans le navigateur avec : cyberduck.io
  • Un terminal Bash comme Putty ou WSL Permet le transfert de fichier via le protocole SFTP ou SSH

Manuels et référence en ligne

Les manuels sont essentiels si tu veux survivre.

Obtenir une information exacte sur l’utilisation d’une fonction, obtenir des conseils sur le développement d’un site …

Pas la peine de courir partout. Privilégie les modes d’emploi.

Même Google est ton ami (si si). RTFM

Éditeurs de texte - IDE - Coder

Il en existe d’autres mais pour commencer cela suffit amplement.

Tu peux aussi apprendre des raccourcis Windows

Liste de plugins utiles pour VS-CODE

Tu peux mettre dans ton sac à dos ces quelques plugins pour vs-code.

Enfin si ça te branche. Plugins VS-CODE

Contrôler / vérifier le code

HTML

CSS

Compatibilité

  • caniuse.com : permet de connaître la compatibilité des dernières technologies du web pour les navigateurs.

  • caniemail.com : permet de connaître la compatibilité des dernières technologies du web pour les clients mail.

Divers

Tableau de caractères spéciaux et raccourcis

Tu peux maintenant faire la combinaison de touches Win + ; pour insérer des émojis. Merci Windows pour ce raccourci.

Copyrighting

Un peu d’aide pour le Copyrighting.

Outils pour le Multimédia

Banques d’images, photos et vidéos.

Retoucher des photos en ligne

Convertir des images et photos en ligne

Un convertisseur d’images en ligne.

Banques photos, vidéo et illustrations vectorielles, Icones et glyphes libres de droits.

Photos

Icônes et illustrations

Vidéos

SVG

Favicons

Gérer tous tes favicons

Fonts - Polices

ou

Aide de google pour l’intégration de polices sur vos sites.

Couleur

Aide pour l’accessibilité, calculer le contraste idéal pour vos couleurs d’arrière-plan et d’avant-plan - Conformité WCAG.

Wireframe, Maquettes et prototypes

Faux textes et images de substitutions

  • Faux textes :
  • Faux utilisateurs :
    • randomuser.me : Liste de photos d’utilisateurs pour maquettes.
    • pravatar.cc : Liste de photos d’utilisateurs pour maquettes.
  • Fausses images :

Viewport et responsive

Ou des Outils pour le responsive.

Performance

F12 sur ton navigateur puis aller dans l’onglet audit.

Sitemap

Génère un sitemap de ton site au format xml.

News, actus, veille et inspirations

Pour trouver l’inspiration.

Pour approfondir tes compétences.

Jeux et apprentissage

Jouer et apprendre c’est possible

Framework CSS

Template de site

Email

Jobs

comments powered by Disqus