After 3 months and 5 days of training
AllezCine is a teamwork project application based on Vue.js developed within the BeCode training.
[AllezCine](link in progress)
3 learners from BeCode program.
- Agile
- Vue
- Axios
- PHP
- MySql Database
- Understanding
- Organisation
- Execution
- Communication
- Cooperation
- Repository :
frontend-AllezCine- Temps nécessaire : 1 semaine
- Travail : équipe (+/- 4)
- consolider les acquis
- utiliser les api's, javascript et php dans un projet réaliste
- avoir un nouveau projet à ajouter à son portfolio
- Faire une application en VueJS avec plusieurs composants.
- Faire des appels vers une API pour recupérer des films à afficher. (the movie db)
- Faire des appels vers une API PHP (créé par vos soins) pour commenter et noter chaques films
- Une application avec deux pages et avec un design fourni (yes !). [Accès rapide]
Pour cela, vous devez utiliser les technologies vues depuis le début, c’est à dire :
- HTML
- CSS
- JavaScript
- vueJS
- PHP
- Base de données
- API
- Responsive design
(ça en fait des choses)
Avant toute chose, sachez qu'il vous faudra
- rédiger un readme.md indiquant (au minimum) la description du projet ainsi que le noms des membres de l'équipe ;
- rédiger une brève description dans le repo
Utilisation d'un kanban
Utiliser l'onglet [Projects] de votre repo pour créer et organiser votre travail grâce au Kandan
Des colonnes "to do", "in progress", "done" pour faire simple et des tickets attribués aux bonnes personnes. Ceci pour vous/nous permettre de visualiser clairement et simplement l'avancement du projet.
Vous allez réaliser, en groupe, un site internet de streaming et vente des films.
- Cliquez ici pour voir le layout Sur la première page, il vous faudra donc afficher différents films ou des series qui viennes de l'api de the movie db.
Votre application doit donc être séparée en différent component (à vous de voir les quels).
- Le header contient un carousel avec 5 films. (bonus 'avec des films aléatoires de the movie db)
- Barre de recherche (doit être fonctionnel)
- (Menu hamburger pour le responsive).
- Les liens du menu doivent pointer vers les pages dédiées :
- Page principal
- Page avec le top des films
- Page avec le top des Series
Les boutons de réseaux sociaux sont en position fixe. Si on clique sur un bouton, il doit s’allonger avec une animation >(ici utilisez juste du CSS).
Chaque film doit comporter :
- une affiche
- un titre
Si on clique sur l’image ou titre du film, on doit pouvoir aller sur la page du film détaillée.
Le footer doit se trouver sur chacune des pages
- Bonus (Afficher les 5 derniers films dans le footer)
le header est le même que celui de la première page
toute les informations du film trouvable dans the movie db') doivent être affichée.
Afficher quelques films supplémentaire.
le header est le même que celui de la première page
- afficher 40 films
- bonus : faire un scroll infini (lorsque que l'on arrive en bas de la page, charger 20 films suivant)
le header est le même que celui de la première page
- afficher 40 series
- bonus : faire un scroll infini (lorsque que l'on arrive en bas de la page, charger 20 series suivantes)
Vous travaillez en groupe :
- Organisez-vous : utiliser un kanban (onglet [projects] dans GitHub).
- Si vous avez des remarques ou des questions, n'hésitez pas à utiliser l'onglet [Issues] de GitHub pour vous exprimer.
- Communiquez : rappelez-vous les bienfaits des réunions SCRUM.