Se connecter

Informatique

Programmation

Sujet : Application web monopage sans framework front
1
abdelmouloud3
Niveau 10
20 novembre 2019 à 11:30:06

Salut tout est dans le titre,

Je suis sur une application web qui fait "virtuellement" 5 pages, enfaite c'est le même patron (entête | panneau d'outil gauche - vue droite | vue bas de page | pied de page), sauf pour la page d'authentification/contact.

Selon la page, c'est juste le contenu des vues et du panneau d'outil qui changent. Je me dis que dans ce cas là autant ne pas recharger la page.

Est ce que je peux faire ça facilement sans Framework comme angular (requête Ajax qui charge le contenu html/css/js et qui l'applique aux bons elements grâce aux id/classe)

yanno69003
Niveau 10
20 novembre 2019 à 11:50:16

Ouais c'est possible avec du JS et des requêtes asynchrone, en gros il te faudrait des divs pour chaques parties importantes de ta page (avec des id différents toussa toussa), et à chaques requêtes asynchrone tu remplis les divs avez les informations que tu reçois de ta requête :noel:

Si tu veux ne pas trop te mélanger dans ton code, tu pourrais le séparer de la manière suivante :
- Tes pages HTML avec les divs positionnées là où il faut dans ta page
- Un fichier JS qui contient l'ensemble des données avec lesquelles l'utilisateur va interagir
- Un fichier JS (ou même dans le même que celui d'avant :hap:) avec des fonctions qui changent l'apparence des divs de la page HTML à partir des données de l'application

Ce qui fait que chaques requêtes asynchrone provoquerait un changement des données de l'application, il ne reste après qu'à appeler les fonctions qui changent l'apparence des divs :oui:

boucif
Niveau 24
20 novembre 2019 à 14:16:48

En faite tu veux faire ce qu'un framework front permet de faire.
Tu vas devoir faire du routing, surtout que je pense que tu veux que l'url de ton site change quand tu vas sur une autre page.
Pour les appels http, tu peux faire des requetes xmlhttp ou du fetch suivant les navigateurs ciblés.

Franchement si tu connais un framework front quelconque fait le avec, tu gagnera pas de temps à le faire en vanillajs.

abdelmouloud3
Niveau 10
20 novembre 2019 à 14:21:53

Effectivement, je veux aussi changer l'url du site.

Le problème c'est que je connais pas de framework front, j'ai juste suivi un tuto il y a longtemps pour faire un petit projet d'exploration avec AngularJS mais c'est tout.

Faut juste voir si le temps de prendre en main AngularJS (ou un autre, mais c'est le premier qui me vient en tête) sera moins long que de faire mon app directement avec seulement du jQuery en gros..

UndeadMarston6
Niveau 10
20 novembre 2019 à 14:41:04

VueJs est super facile à prendre en main, tu te fais une installation avec Vue CLI et c'est partie tu feras ça bien. :ok:

AsariTech
Niveau 8
20 novembre 2019 à 15:29:46

Vue est pas si évident que ça même en suivant la doc, j'ai essayé et il y a pas mal de choses qui sont assez compliquées à comprendre. Vue CLI c'est pire pour commencer je trouve.

UndeadMarston6
Niveau 10
20 novembre 2019 à 15:54:13

Pourtant Vue CLI te fournit des exemples de comment faire si t'es perdu ce qui te permet de partir des exemples pour crée tes propres composants/pages :(

Mais après si il veut bien comprendre Vue, il peut faire une installation sans Vue CLI, c'est une bonne idée :ok:

La doc de Vue est cool en plus, facile à suivre et puis si l'auteur pense à faire en vanillajs je présume qu'il a déjà un certain niveau en JS donc il devrait appréhender les frameworks assez facilement finalement

AsariTech
Niveau 8
20 novembre 2019 à 21:05:29

Je pense que tu as raison, ça doit être ça, je n'ai pas un niveau de compétence suffisamment élevé en JavaScript ni dans les outils nodeJS, webpack, Babel et tout ce qui s'en suit. Vraiment je n'ai pas trouvé Vue aussi intuitif de prime abord.

boucif
Niveau 24
20 novembre 2019 à 21:10:35

Sinon angular 8 ta tout de base pour faire tes requêtes http ton routing

UndeadMarston6
Niveau 10
21 novembre 2019 à 01:31:11

Je pense que tu as raison, ça doit être ça, je n'ai pas un niveau de compétence suffisamment élevé en JavaScript

Désolé si je t'ai donné l'impression de te dire ça mais c'est pas du tout ce que je veux dire. :(

Et bien j'ai trouvé Vue assez intuitif pour ma part et ludique même, ça doit dépendre des gens. :(

boucif
Niveau 24
21 novembre 2019 à 08:17:47

Vue m’a paru simple en ayant déjà fait du Angular auparavant, il est très proche de la philosophie d’AngularJS.

C’est un projet professionnel ou personnel, t’as une deadline ?

abdelmouloud3
Niveau 10
21 novembre 2019 à 09:52:15

Je suis en "stage" (entre guillemet car j'ai pas mal d'autonomie pour un stagiaire).

Ma deadline c'est la fin de mon stage (donc Février), je ne devrais donc pas avoir de soucis de délais. Je prend plus de temps que prévu car je démarre de 0 dans le dev web (j'ai commencé il y a 2 mois). Mais si il faut se former sur un framework le temps n'est vraiment pas un problème.

AsariTech
Niveau 8
21 novembre 2019 à 10:11:57

UndeadMarston: Ne le soit pas, je suis assez lucide pour reconnaître que je suis la plupart du temps mauvais et en manque cruel de compétences dans tout ce que j'entreprends. C'est ce que tu disais à l'auteur par rapport à son niveau et que si il était bon en JS il aurait moins de mal a apprendre un framework qui m'a justement fait réfléchir.

UndeadMarston6
Niveau 10
21 novembre 2019 à 11:38:34

Le 21 novembre 2019 à 10:11:57 AsariTech a écrit :
UndeadMarston: Ne le soit pas, je suis assez lucide pour reconnaître que je suis la plupart du temps mauvais et en manque cruel de compétences dans tout ce que j'entreprends. C'est ce que tu disais à l'auteur par rapport à son niveau et que si il était bon en JS il aurait moins de mal a apprendre un framework qui m'a justement fait réfléchir.

Te dévalorise pas trop, les compétences ça s'acquiert ! :ok:
J'étais très médiocre en JS et depuis que je me suis mis à Vue j'ai beaucoup progressé ! C'est aussi ça l'avantage d'un framework (je trouve) ça t'encadre bien. :oui:

Pour finir l'auteur je pense que te mettre à un framework c'est une bonne chose (et surtout ça permet d'avoir potentiellement un code plus facilement maintenable) et je te conseil Vuejs qui est très bien (surtout que ça t'apporte un bon environnement de dev avec les fichiers .vue) mais tu peux aussi aller voir du côté d'Angular ou de React :ok:

TechnoForce3
Niveau 36
21 novembre 2019 à 12:57:51

Le 21 novembre 2019 à 09:52:15 Abdelmouloud3 a écrit :
Je suis en "stage" (entre guillemet car j'ai pas mal d'autonomie pour un stagiaire).

Ma deadline c'est la fin de mon stage (donc Février), je ne devrais donc pas avoir de soucis de délais. Je prend plus de temps que prévu car je démarre de 0 dans le dev web (j'ai commencé il y a 2 mois). Mais si il faut se former sur un framework le temps n'est vraiment pas un problème.

Vois avec ton tuteur alors. Tu dois bien avoir un référent technique ou équivalent qui pourra te conseiller sur vers quoi aller ou au moins te dire quel framework ils utilisent habituellement.

boucif
Niveau 24
21 novembre 2019 à 13:47:06

Le 21 novembre 2019 à 09:52:15 Abdelmouloud3 a écrit :
Je suis en "stage" (entre guillemet car j'ai pas mal d'autonomie pour un stagiaire).

Ma deadline c'est la fin de mon stage (donc Février), je ne devrais donc pas avoir de soucis de délais. Je prend plus de temps que prévu car je démarre de 0 dans le dev web (j'ai commencé il y a 2 mois). Mais si il faut se former sur un framework le temps n'est vraiment pas un problème.

Bein c'est l'environnement parfait pour commencer à apprendre à utiliser un framework front, jQuery n'est pratiquement plus utilisé sur de nouveau projet ..
Perso je connais Angular/Vue, je te conseille les dernières versions d'angular (angular 8) avec typescript qui est poo (proche de c#/java), sinon react, sachant que React/Angular sont souvent les compétences les plus demandés dans le monde pro en front, ensuite vient Vue, le reste c'est anecdotique ...

Raidden36
Niveau 6
21 novembre 2019 à 14:02:43

En vrai t'en a pour 10 secondes avec des framework front.

https://www.creative-tim.com/templates/react-free

hop tu récupère ça, tu te forme sur le tas (c'est assez simple, même pour un débutant, pas de soucis) et en une heure et demi t'as fais ton front. Regarde du côté de la catégorie dashboard, ça me semble être ce que tu veux.

Marav
Niveau 28
22 novembre 2019 à 08:26:14

Si t'es débutant je pense que c'est beaucoup plus formateur de faire ça en VanillaJS / jQuery.

NurseryRhyme
Niveau 9
22 novembre 2019 à 09:59:16

Arrêtez de conseiller aux gens de sortir Angular pour une micro-webapp de 5 pages, c'est a cause des gens comme vous que les sites sont bloated a mort.

Y'a des librairies légères pour la navigation coté client, genre sammyjs et ca sera amplement suffisant.

UndeadMarston6
Niveau 10
22 novembre 2019 à 10:22:02

plus formateur de faire ça en VanillaJS / jQuery

Je suis à moitié d'accord :

  • Faire ça en vanillaJS peut-être très formateur, oui mais aussi être un frein, découvrir toute les possibilités de JS avec un framework être une bonne première approche pour ensuite faire ça en VanillaJS
  • jQuery par contre n'a aucun intérêt, techno dépassé et quasi plus utilisé, à oublier

Arrêtez de conseiller aux gens de sortir Angular pour une micro-webapp de 5 pages, c'est a cause des gens comme vous que les sites sont bloated a mort.

Le but ici c'est que l'auteur, qui est stagiaire, puisse se former sur des technos comme Angular, React ou VueJS qui donne du boulot ... sammyjs est surement un choix pertinent pour son cas mais son but principal serait pas plus la formation et la montée en compétence plus que de faire un site de 5 pages ? :o))

1
Sujet : Application web monopage sans framework front
   Retour haut de page
Consulter la version web de cette page