The last few weeks of my life have been dedicated to studying for exams, and because of this, I felt it may be a good time to write an article on free programming resources. These are links and websites I use frequently for checking syntaxes, or searching for commonly used workarounds.
Ces quelques dernières semaines ont été consacrées aux révisions pour les examens et, à cause de cela, j'ai senti que c'était le bon moment pour écrire un article sur les ressources de la programmation libre. Ce sont des liens et des sites Web que j'utilise fréquemment pour vérifier les syntaxes ou pour chercher des solutions de contournement utilisées couramment.
Web Design I decided to keep this section separate from Flexbox, since the following links apply to any web design you may do - even if you’re still working with floats and clearfixes. If you’re looking for sites to do with Flexbox, jump to the next section. • http://caniuse.com/ - This is a website dedicated to displaying the support for various properties used in web design (CSS, HTML, SVG, JS, etc). It indicates which browsers support which features, as well as giving notes on workarounds needed in certain browser versions. This can be a handy tool to decide whether or not a feature should be used in a project. • https://github.com/AllThingsSmitty/css-protips - A GitHub repository dedicated to tips and tricks for CSS, typically dedicated to using little-known features, or new implementations in CSS3. • http://codepen.io/ - A sandbox environment website where you can test out ideas, or browse other user’s “pens”. A terrific resource for being inspired, or for seeing how people have applied creativity to “standard” features. Think of it as being a bit like JSBin, but with showcasing support.
Conception Web
J'ai décidé de séparer cette section de celle sur Flexbox, car les liens suivants s'appliquent à n'importe quelle conception Web que vous pouvez faire - même si vous travaillez encore avec les « floats » et les « clearfixes ». Si vous cherchez des sites pour travailler avec Flexbox, passez à la section suivante. • http://caniuse.com/ - C'est un site Web dédié à la présentation d'aide pour diverses propriétés utilisées dans la conception Web (CSS, HTML, SVG, JS, etc.). Il indique quels navigateurs supportent quelles caractéristiques et présente aussi des notes sur les solutions nécessaires avec certaines versions de navigateur. Il peut être un outil pratique pour décider si une fonction devrait être utilisée, ou pas, dans un projet. • https://github.com/AllThingsSmitty/css-protips - Un dépôt Github consacré aux trucs et astuces pour CSS, à l'utilisation de fonctions peu connues et aux nouvelles implémentations de CSS3. • http://codepen.io/ - Un environnement de site Web « bac à sable » où vous pouvez tester des idées ou parcourir les bonnes idées d'autres utilisateurs. Une ressource terrible pour être inspiré ou pour voir comment des gens ont fait preuve de créativité avec des fonctions « standard ». Voyez-le un peu comme JSBin, mais avec l'aide de démonstrations.
Flexbox Workarounds & Bugs Since Flexbox is now pretty well supported, it has started being used to avoid the messy float/clearfix systems of older web frameworks. However, because it’s pretty young, there can be some bugs that occur in various browsers, or some use cases that may seem difficult to implement. The following two links are my go-to resource for Flexbox documentation: • https://github.com/philipwalton/flexbugs - the Flexbugs repository on Github is a good collection of known bugs, and possible workarounds. The issues section is very active, and users use it to discuss new bugs, or to document workarounds. • https://philipwalton.github.io/solved-by-flexbox/ - Written by the same user as Flexbugs, it is a very nice showcase website, indicating some ways to use Flexbox.
Bugs et solutions de Flexbox
Comme Flexbox est maintenant bien supporté, on commence à l'utiliser pour éviter les systèmes bordéliques avec float/clearfix des vieux frameworks Web. Cependant, comme il est assez jeune, des bugs, ou des cas d'utilisation qui peuvent paraître difficiles à implémenter, peuvent arriver sur certains navigateurs. Les deux liens suivants sont mes ressources de prédilection pour la documentation sur Flexbox : • https://github.com/philipwalton/flexbugs - Le dépôt Flexbugs sur Github est une bonne compilation des bugs connus et des contournements possibles. La section des problèmes est très active et les utilisateurs s'en servent pour parler des nouveaux bugs et pour documenter les solutions. • https://philipwalton.github.io/solved-by-flexbox/ - Écrit par le même utilisateur que Flexbugs, c'est un très intéressant site Web de cas concrets, montrant certaines façons d'utiliser Flexbox.
Design (in general) These links are geared towards anyone who creates anything graphical. As colors can be a big factor in any design (and certain considerations must sometimes be taken into account), I frequently use the sites below to test possible color schemes before finalising a design. • http://www.colourlovers.com/, https://www.coleure.com/, http://www.colorion.co/ - These are three websites that offer color palette creation. If you’re just looking for various shades of a particular color, or more information about a particular shade, I would use the following links. • http://www.color-hex.com/, http://www.colorhexa.com/ - Both these sites aren’t intended to create a palette, but do offer vast amounts of information for any shade. Useful for converting to hex from rgb (or vice-versa), as well as for anyone who wishes to take color blindness into account.
Conception (généralités)
Ces liens sont ciblés vers toute personne qui crée quelque chose de graphique. Comme les couleurs peuvent être un facteur important dans n'importe quelle conception (et certaines considérations doivent parfois être prises en compte), j'utilise fréquemment les sites ci-dessous pour tester les choix possibles de couleurs avant de finaliser une conception. • http://www.colourlovers.com/, https://www.coleure.com/, http://www.colorion.co/ - Ces trois sites Web proposent la création de palettes de couleurs. Si vous êtes juste à la recherche de nuances variées d'une couleur particulière, ou de plus d'information sur une nuance particulière, j'utiliserais plutôt les liens suivants. • http://www.color-hex.com/, http://www.colorhexa.com/ - Ces deux sites n'ont pas la création de palette pour objectif, mais offrent une énorme quantité d'informations sur chaque nuance. Utile pour convertir d'hexa en rgb (ou vice-versa), tout comme pour quiconque souhaitant prendre en compte le daltonisme.
Programming (in general) For anyone who is a programmer, and is looking for accessible documentation, or resources for learning, this is the section for you! • http://devdocs.io/ - A terrific web app offering documentation for a huge selection of languages. It offers an offline mode, where you can save your documentation for viewing, even if you don’t have web access. It is a terrific way to have documentation with you when on the go. • http://news.softpedia.com/news/ubuntu-touch-s-web-browser-to-improve-the-google-hangouts-experience-in-ota-11-504658.shtml - PacktPub is a publishing house for technical books. I highly recommend their newsletter for finding out about deals. However, for anyone looking for free resources, they also offer one free ebook per day. It’s a curated list (so no picking your own), but some months they’ll choose a theme (i.e. Python web development), and release books on that topic. All you require is an account (which is free). After that, you can view and read your books on practically any device I know of.
Programmation (généralités)
Pour tout programmeur à la recherche d'une documentation accessible, ou de ressources pour apprendre, cette section leur est destinée ! • http://devdocs.io/ - Une application Web terrible offrant de la documentation sur une vaste sélection de langages. Il offre un mode hors ligne, où vous pouvez sauvegarder et consulter la documentation, même si vous n'avez pas d'accès Web. C'est une façon fantastique d'avoir la documentation avec vous quand vous êtes en déplacement. • http://news.softpedia.com/news/ubuntu-touch-s-web-browser-to-improve-the-google-hangouts-experience-in-ota-11-504658.shtml - PacktPub est une maison d'édition de livres techniques. Je recommande fortement leur lettre d'information pour découvrir des bons plans. Cependant, pour tous ceux qui cherchent des ressources gratuites, ils offrent aussi un ebook gratuit par jour. C'est une liste organisée (pas de choix individuel), mais, certains mois, ils choisissent un thème (par exemple, le développement Web avec Python) et rendent disponibles des livres sur ce thème. Il vous faut juste un compte (qui est gratuit). Ensuite, vous pouvez voir et lire vos livres sur pratiquement n'importe quel appareil que je connais.
Cheatsheets These are links to single pages of documentation, intended to be an “at a glance” representation of the most frequently used commands. • https://github.com/wsargent/docker-cheat-sheet - A cheat sheet for Docker. If you can’t quite remember the exact name of the command, this may be a good spot to look. • http://docs.emmet.io/cheat-sheet/ - For anyone who uses Emmet to make their web programming life easier, this is the official cheat sheet.
Pense-bête
Voici des liens vers des pages uniques de documentation, dont le but est la représentation « d'un seul coup d’œil » de la plupart des commandes les plus utilisées. • https://github.com/wsargent/docker-cheat-sheet - Une page pense-bête sur Docker. Si vous n'arrivez pas à mémoriser le nom exact de la commande, c'est un bon endroit à consulter. • http://docs.emmet.io/cheat-sheet/ - Pour tous ceux qui utilisent Emmet pour rendre leur vie de programmeur Web plus facile, c'est la page pense-bête officielle.
Learning & Practicing These links are for online courses or tools to practice (and learn) programming languages. If a site offers only some free courses, it will be noted in the description. • https://www.codecademy.com/ - This site offers some free courses (sometimes just intro lessons, sometimes an entire path). They have a terrific in-browser IDE for working through the courses. Also, once or twice a year, they will open up all courses for 48 hours, giving you an opportunity to learn whatever you’d like. • http://exercism.io/ - A free website/CLI tool that offers a series of programming challenges in various languages. They supply the tests that your code must pass in order to “succeed” at the given task. It also offers peer review. A terrific way to get comfortable in a new language. I’m not sure if you could approach this without any knowledge of the language you want to learn, but even rudimentary experience should be sufficient to get started.
Apprendre et s'entraîner
Ces liens sont des cours en ligne ou des outils pour s'entraîner aux langages de programmation (et les apprendre). Si un site offre seulement quelques cours gratuits, ce sera indiqué dans ma description. • https://www.codecademy.com/ - ce site offre quelques cours gratuits (parfois de simples introductions aux cours, parfois un parcours complet). Une superbe interface utilisateur est intégrée au navigateur pour suivre les cours. De plus, une ou deux fois par an, l'accès à tous les cours est libre pendant 48 heures, vous donnant l'opportunité d'apprendre ce que vous voulez. • http://exercism.io/ - Un outil de site Web/CLI gratuit qui offre une série de défis de programmation dans des langages variés. Votre code doit avoir une note convenable aux tests fournis pour « réussir » une certaine tâche. Le site propose aussi une revue de ce code par d'autres personnes. Une fantastique façon de s'habituer à un nouveau langage. Je ne suis pas sûr que vous puissiez aborder ceci sans la moindre connaissance du langage que vous voulez apprendre, mais même une expérience rudimentaire devrait être suffisante pour démarrer.
• http://ureddit.com/ - University of Reddit. Offers a wide variety of courses. • https://www.coursebuffet.com/ - Course Buffet offers a catalog of free courses found across the web (offered by universities). Depending on what it is you want to learn, you may have some luck here. • https://www.skillshare.com/ - This site offers small bite-sized lessons on a variety of topics. Free users have a smaller catalog to choose from, and have no teacher support or offline access. • https://www.khanacademy.org/ - Khan Academy offers a wide variety of what I would class as “typical” subjects - math, computer sciences, and so forth. While not necessarily as focused as some courses on this list, it’s still a great resource depending on what you’d like to learn. It’s completely free, and the courses I’ve tried have been quite well done. • https://www.udacity.com - Udacity works in partnership with large companies (such as Google and Facebook) to offer what they call Nanodegrees. These Nanodegrees are paid courses. However, they do have free courses available as well (filter the catalog by Free Courses). These do not result in certificates or degrees. Overall, the website works well, and I have completed a few free courses created by Google. For a little more info on the Nanodegrees, jump to the next section.
• http://ureddit.com/ - Université de Reddit. Offre une vaste variété de cours. • https://www.coursebuffet.com/ - Course Buffet offre un catalogue de cours gratuits disponibles sur le Web (proposés par des universités). Suivant ce que vous voulez apprendre, vous pouvez tomber sur une bonne pioche. • https://www.skillshare.com/ - Ce site offre des petites leçons minuscules sur de nombreux sujets. Les utilisateurs à titre gratuit disposent d'un catalogue de choix réduit et ne bénéficient pas du support d'un instructeur ou du mode hors ligne. • https://www.khanacademy.org/ - Khan Academy offre une grande variété de ce que je classerais dans les sujets « typiques » : maths, informatique et ainsi de suite. Sans être nécessairement aussi spécialisé que certains autres sites de la liste, c'est quand même une bonne ressource suivant ce que vous voudrez apprendre. Il est complètement gratuit et les cours que j'ai essayés étaient très bien faits. • https://www.udacity.com - Udacity travaille en partenariat avec de grandes entreprises (comme Google ou Facebook) pour proposer ce qu'ils appellent des Nanodegrees. Ces « nano-niveaux » sont des cours payants. Cependant, certains cours gratuits, pour lesquels aucun certificat ou niveau n'est délivré, sont aussi disponibles (filtrez le catalogue avec « Free courses » - cours gratuits). Globalement, le site fonctionne bien et j'ai fini quelques cours gratuits créés par Google. Pour un peu plus d'information sur les Nanodegrees, passez à la section suivante.
Bonus Section This section contains a few paid course sites, and some free courses geared towards language learning. • http://www.memrise.com/ - (Language) This is a website geared towards learning a language by repetition. They have a large assortment of options. • https://www.duolingo.com/ - (Language) A free site for learning a limited selection of languages (things like Spanish, French, Italian, etc). I don’t know how frequently new languages are added (if at all), but it may be worth a browse. • https://www.udacity.com - (Courses) If you’re looking for a paid courses for specific skills, you may have success finding one here. They also offer a Nanodegree Plus option (job guarantee within 6 months, or 100% refund on the course costs). I’m not sure about the availability of those offerings internationally. • https://www.udemy.com - (Courses) A massive catalog of courses ranging from hacking to instrumental master classes. They currently offer some free courses as well. However, they frequently discount the paid courses down to $10-20. As of April this year, all courses have been reduced in price to sit between $20 and $50 (standard pricing), so I’m not sure if the discounts will be as frequent as previously.
Section Bonus
Cette partie contient quelques sites de cours payants et quelques cours gratuits orientés vers l'apprentissage des langues.
• http://www.memrise.com/ - (Langue.) Ce site Web est orienté vers l'apprentissage d'une langue par la répétition. Il dispose d'un grand nombre d'options. • https://www.duolingo.com/ - (Langue.) Un site gratuit pour apprendre une sélection limitée de langues (comme l'espagnol, le français, l'italien, etc.). Je ne sais pas si de nouvelles langues sont ajoutées fréquemment (ou pas du tout), mais il mérite une visite. • https://www.udacity.com - (Cours.) Si vous êtes à la recherche de cours payants sur des sujets particuliers, vous pouvez avoir la chance d'en trouver un ici. Une option Nanodegree Plus est aussi disponible (garantie d'un travail dans les 6 mois ou remboursement total du coût des cours). Je ne suis pas sûr que ces offres soient disponibles à l'international. • https://www.udemy.com - (Cours.) Un gros catalogue de cours allant du hacking aux master-classes instrumentales. Actuellement, quelques cours gratuits sont aussi proposés. Cependant, leurs cours payants sont souvent proposés pour 10 à 20 $. Depuis avril de cette année, tous les prix des cours sont réduits pour se situer entre 20 et 50 $ ; aussi, je ne suis pas sûr que les remises seront aussi fréquentes qu'avant.
I hope this list of resources will benefit at least a few readers. If you think I’ve missed something, feel free to let me know via email! I’m also happy to hear about any success stories (or issues) you’ve had with any of the items on this list. As always, I can be reached at lswest34+fcm@gmail.com.
J'espère que cette liste de ressources sera utile pour au moins quelques lecteurs. Si vous pensez que j'ai oublié quelque chose, n'hésitez pas à me le faire savoir par mail ! Je serais aussi très content de vous entendre raconter vos succès (ou vos problèmes) rencontrés avec des éléments de cette liste. Comme toujours, je suis joignable à lswest34+fcm@gmail.com.