apprendre javascript avec webflow
Photo de Leah Kelley de Pexels

Tu entends souvent parler de HTML, de CSS et de JavaScript ? Il est peut-être temps pour toi d’essayer de comprendre ces langages, surtout si tu veux poursuivre ta carrière de webdesigner freelance, sur Webflow. D’ailleurs, aujourd’hui, je vais te montrer comment apprendre JavaScript avec Webflow.

Pourquoi apprendre JavaScript avec Webflow ?

Peut-être l’as-tu remarqué, mais la majorité des programmes et projets web incluent désormais le JavaScript. Il a le vent en poupe ! En tout cas, c’est l’une des raisons qui m’ont motivé à m’y intéresser.

J’ai déjà commencé quelques théories. Il y a toute une panoplie de sites web qui donnent de riches informations là-dessus, mais ceux qui m’ont le plus intéressé :

Si tu as d’autres sources à me conseiller, je suis preneur. Mets-les juste en commentaire, ou écris-moi.

Par-dessus tout, avec l’aide de Webflow, tu comprendras JavaScript assez vite !

Il y a une vidéo Youtube dans laquelle je décris cela en bas de l'article. Soutenez-moi en vous abonnant à la chaine YouTube "Happy Desk Design"

apprendre javascript avec webflow
Photo de Jonathan Petersson de Pexels

JavaScript, en pratique

Si c’est un tout nouveau terme pour toi, je comprends très bien que tu as du mal à suivre. En fait, c’est surtout grâce à JavaScript qu’on peut obtenir des effets, animations, calculs ainsi qu’autres facteurs invisibles à l’oeil nu, mais très utiles pour un site web, logiciel ou application.

Toutefois, l’animation est surtout celle qui nous intéresse dans cet article.

JavaScript dans Webflow

Encore ici, je t’invite à choisir un modèle de site qui t’inspire sur Webflow (de préférence, avec beaucoup d’animations ; c’est ce qui te permet le plus facilement d’apprendre JavaScript avec Webflow). Pour cela, rends-toi donc dans le Showcase.

Ensuite, tu dois dupliquer le modèle concerné, et ensuite le publier pour t’en approprier. De cette manière, tu pourras accéder aux codes, et éventuellement, les modifier.

apprendre javascript avec webflow
Photo de Gelgas de Pexels

En haut à droite, sous le signe <>, tu as accès à tous les codes (notamment JavaScript). Si tu veux les analyser et ainsi, apprendre JavaScript avec Webflow, tu n’as qu’à les exporter :) Toutes les animations que tu auras créées à partir de Webflow seront automatiquement générées en code JavaScript.

Passons maintenant à l’étape suivante : essayer de comprendre les codes JavaScript.

Les animations sont accessibles dans la barre à droite, sous l'icône en forme d’éclair. Tout se trouve sous la “page load”. Une prévisualisation des animations étape par étape est même possible. Tous les effets (pour le modèle de site que tu as choisi) sont effectivement recensés dans cette barre-là.

De là, tu as même le droit de les modifier (voire, supprimer des existants) :

  • nombre de répétitions d’un effet
  • délai d’une animation
  • changement de couleur
  • élément déclencheur d’un effet
  • la taille des éléments
  • l’animation au survol
  • etc.

Pour les plus aguerris, l’ajout de code JavaScript (dans le but d’ajouter de nouvelles animations) dans cette interface est envisageable.

apprendre javascript avec webflow
Photo de Min An de Pexels

Bref, tu auras un aperçu de la façon dont le développeur de ce modèle s’y est pris en JavaScript, lorsqu’il a créé le site. Il serait donc plus facile de comprendre ce langage, et pourquoi pas d’apprendre JavaScript avec Webflow. Il suffit de t’y inscrire si ce n’est pas encore fait !

Conclusion
Je pense que tu as fait le tour là. JavaScript n’est sûrement plus très nouveau pour toi. Alors, est-ce que cela t’intéresse ? En tout cas, à moi, oui ! C’est pourquoi je vais vraiment approfondir ce langage !

Ça t’intéresserait aussi d’apprendre HTML avec Webflow, ou d’apprendre CSS avec Webflow ?

YouTube : Apprends JavaScript avec Webflow

Reviens sur cette page chaque fois que tu voudras. As-tu trouvé des idées que j'aurais oubliés? Si oui, quels sont-ils? Laisse un commentaire ci-dessous ou envoi un mail à hello@happydesk.be
Kevin Palombo, Gérant de Happydesk

Hello 👋

Je suis en mission pour ton Web Succès! Qui je suis?

Tu veux apprendre?

Un café? Mais oui, prends ton temps!

17/9/2020

Comment choisir la typographie d’un site ?

La typographie est une forme de graphisme à part entière, c'est pourquoi on doit accorder une importance particulière au choix de typographie.

Ça m'intéresse
11/9/2020

La théorie des couleurs en webdesign

La couleur en webdesign est très importante. Comment fais-tu pour choisir les palettes à utiliser (titres, boutons, etc.) ? Voici la théorie des couleurs.

Ça m'intéresse
28/8/2020

Théorie de Gestalt sur Webflow : comment fonctionne-t-elle ?

Dans la conception d'un site, il faut respecter une règle : la théorie de Gestalt sur Webflow. Qu’est-ce que c’est ? Quels avantages promet-elle ?

Ça m'intéresse

Je veux...

Happy.business

Parce que toute histoire commence par une rencontre. Prenons contact, une vraie personne se cache derrière Happydesk et sera ravie d’écouter ce que vous avez à lui raconter !

Prendre un rendez-vous

Happy.webnews

Parce que nous mettons toutes nos connaissances du monde Digital à disposition de notre Communauté pour les accompagner dans leur quête du Web Succès.

Lire le blog

Happy.webevent

Parce que se sentir moins seul renforce notre essence de leader. Happydesk organise des Events entre Entrepreneurs plus que motivés à se dépasser et atteindre des objectifs jamais espérés.

Assister aux events

Tu veux favoriser ta réussite?

OUI, ça m'intéresse !