Templete html css JS pur

Fermé
ruj100 Messages postés 30 Date d'inscription vendredi 28 décembre 2018 Statut Membre Dernière intervention 18 juillet 2021 - 2 juin 2020 à 21:43
 Tchoupi - 2 juin 2020 à 22:32
Bonjour,

Pour mon apprentissage, je recherche désespérément des templetes réalisés en html css JS pur pour pouvoir analyser le code.

Je trouve que des templete wordpress ou bootstrap trop compliqué parcequ'ils contiennent des fichier de configuration.

alors la solution serait peut etre, par je ne sais quel methode, de trouver des sites realisés en pur html css js et d'utiliser un logiciel comme website downloader pour telecharger les fichier sources.


Configuration: Windows / Firefox 76.0

1 réponse

Salut,
template ça veut dire modèle pour moi.
Hors un modèle sans configuration ça n'a pas grand intérêt si l'on peut pas ce servir code ce modèle pour le configurer et donc le personnaliser avec le texte et l'apparence qu'on veut.

Un site web (ou une page)c'est souvent plusieurs fichiers.
Là vous parlez de CMS(comme Wordpress) qui sont des programmes incluant des pages dynamiques.
Une page dynamique c'est plus que du HTML, CSS, et JavaScript puisque la partie la plus importante(et qui compose la plupart des sites) c'est la partie qui permet que la page soit dynamique: la base de données et le le programme serveur qui permettent d'écrire HTML et ses contenus(voire CSS aussi si l'apparence est configurée de manière dynamique).

Pour faire ce que vous voulez vous pouvez simplement faire clic droit sur une page(n'importe laquelle) et choisir: "Afficher code source" ou utiliser la console et outils de développement du navigateur.

Mais dans quel but?
Tout d'abord une partie d'une page dynamique est construite sur serveur avant d'être envoyée.
C'est par exemple PHP et SQL et celui ci sera donc invisible sur le résultat fournit à l'internaute(et inacessible directement dans la plupart des cas).
Donc vos n'affichez qu'une partie tronquée.

Ensuite ça vous sert à quoi d'afficher un langage que vous ne comprenez pas et donc vos n'avez pas le dictionnaire ni la syntaxe et la grammaire?
A pas grand chose.

Si vous voulez apprendre vous devez apprendre le fonctionnement de ces technologies(leur rôle et leur but aussi) ainsi que la syntaxe et grammaire du langage.
J'ai beau aimer la littérature mais si je regarde un livre en coréen ou espagnol sans en connaître un seul mot ça servira à rien.
Idem pour ce que vous voulez il me semble.

Quant à Bootstrap c'est une utilisation des technologies que vous citez qui utilise CSS et JavaScript pour simplifier l'écriture(accélérer celle ci plutôt) et donner des modèles de mises en page par un système de grille de positionnement par exemple.

Donc même remarque que la précédente...

On parle bien de langages informatique et la finalité de ces langages est de représenter pour un ordinateur des concepts humains dont un ordinateur n'a aucune idée. C'est bien ça que veut dire informatique: il n'y a aucune forme et uniquement un traitement logique et mathématique.

Donc si vous n'apprenez pas l'utilité et les concepts qui doivent être inclus pour transformer la pensée humaine en modèle mathématique et logique exploitable par une machine qui n'a aucune réelle pensée ou est incapable du moindre concept je vois pas trop l'intérêt de votre démarche.

J’exagère un peu, les langages ont eu tendance à se simplifier depuis les débuts de l'informatique à aujourd'hui. En effet on est loin de l'assembleur qui est un langage de programmation qui fonctionne par l'adressage ds espaces de stockage mémoire situés dans l'ordinateur.
La programmation va apporter des méthodologies et des façons de faire qui rapproche les concepts humains de leur modélisation physique et mathématique concrète.

Enfin HTML et CSS ne sont pas de la programmation mais une description des contenus d'une page et le repérage de ceux ci.
Leur principes sont pour HTML assez simples:
C'est un liste qui indique les contenus et leurs qualités sémantique(une image est désigné par élément "img", un paragraphe de texte par l'élément "p", un titre un article ou partie d'un texte, un lien hypertexte et tous les contenus sont désignés de la même manière).
Il faut donc apprendre son écriture et la nomenclature et hiérarchie(imbrication, ordre et valeurs possibles) de ces éléments.
Pour CSS c'est un peu le même principe mais ça définit des règles de mises en pages que l'on peut faire varier comme changer les dimensions d'un texte(HTML), de la couleur ou l'image de fond d'un élément(HTML) et bien d'autres choses qui vont jusqu'à la traduction en audio des contenus(HTML) ou l'animation d'éléments.
C'est donc une liste des paramètres de configurations(apparence, positions, tailles, couleurs etc...) que l'on veut.
Ce que l'on veut implique qu'aucune modèle/template ne donne de règles à suivre. Les règles à suivre sont les propriétés que l'on veut modifier pour obtenir l'apparence voulue. De même que HTML indique les règles pour afficher une page web c'est vous et le contenus qui déterminez l'ordre et les contenus à afficher.
On parle bien de langage et connaître des verbes, les sujets possibles et la formation d'une phrase permet d'écrire ou exprimer n'importe quel texte. Regarder un texte sans connaître le sens des mots n'a donc strictement aucun intérêt, il faut connaître les mots et les situations dans lesquelles on peut et doit les utiliser(ex: à l'oral, dans un message, un livre ...).

Quant à JavaScript c'est un langage de programmation. Il permet donc de faire des structures logiques, de manipuler des textes comme HTML et CSS et leurs contenus, de faire des opérations mathématiques et des comparaisons.
Encore faut il savoir ce que l'on veut manipuler et pourquoi, ce que l'on veut calculer ou comparer pour comprendre.

Idem ici regarder un script pour une fonctionnalité donnée ne vous apportera rien si vous n'avez pas idée de ce à quoi correspondent les fonctions et méthodes du langage ou les valeurs qui peuvent être utilisées(numériques ou chaînes de caractères par exemple).

Bref quel est votre but en fait?
Si vous voulez apprendre n'importe quel langage commencer par les bases et les utilisations de celui ci.
Une analyse façon rétro-ingénierie vous sera utile uniquement quand vous aurez acquis ces bases sinon l'ensemble restera incompréhensible.
Il n'y a aucun modèle donné qui indique ce qu'il faut faire puisque ce qu'il faut faire est soumis au besoin (humain) particulier tout comme il n'y aucun site modèle ou qui indique la même chose(sinon aucun intérêt de créer quelque chose qui existe déjà).
Je veut dire que les règles sont les même et comme pour le français ou une langue étrangère il faut connaître les règles d'écriture (syntaxe, grammaire, contexte d'utilisation) et qu'avec ces règles on peut décrire les messages, résultats d'affichages et fonctionnalités de programmation désirées.
CQFD
0