Ce projet est un un générateur de noms d'utilisateurs. De nombreuses fonctionnalités seront ajoutées au fur et à mesure. Le lien : myusername.app
L'idée était d'avoir un micro framework à usage personnel le plus léger et rapide possible. La configuration est bouclée en 2 minutes, le passage développement => production ne nécessite aucune action particulière (un simple transfert via FTP suffit).
Features :
- Architecture MVC objet
- URL rewriting, routing & paramètres de routes
- Administration
- Possibilité d'architecture en modules (HTML / CSS / JS dans le même dossier sans fractionner
les fichiers à travers plusieurs dossiers serveur / public)
- switch automatique des BDD développement / production et gestion du https qui ne nécessite
aucune action particulière.
- petits helpers : flash messages, faille XSRF, versioning des fichiers pour actualiser le
cache navigateur ...
Le Framework ainsi que sa documentation sont récupérables sur simple demande :
Contact
Un carrousel avec pas mal de fonctionnalités telles que play/pause, les flèches, dots, et swipe (souris et tactile). Une démo ci-dessous, et le CodePen.
Menu accordéon uniquement en HTML / CSS. L'astuce est d'utiliser les boutons radios pour l'ouverture / fermeture. On peut fermer un onglet de 2 manières : à l'aide de la croix en bas à droite ou en cliquant à nouveau sur l'en-tête.
.
.
.
.
.
End content 1
.
.
.
.
.
End content 2
.
.
.
.
.
End content 3
Pour le code est l'explication, tout est sur CodePen.
Le but ici est de redimensionner un élément / une police en fonction de
la taille de la zone d'affichage. Je proscris les media querries car trop lourdes
selon moi.
Reste l'unité vw, qui correspond à 1% de la largeur du viewport. Mais elle a certaines
limites, notament sur les écrans très larges.
L'objectif peut être formulé ainsi : "Je veux que mon élement puisse avoir une taille comprise entre 100 et 200 pixels, pour un affichage allant de 600 à 1200 pixels" (sous entendu il reste figé à 100 pixels sous les résolutions de 600px, et à 200 pixels pour les résolutions supérieures à 1200 pixels). c'est chose faite, avec l'explication sur CodePen.