Bonsoir, si tu veux un conseil avant de tenter des exercices finis deja l'entièreté du cours que tu suis. Ensuite tu peux ecrire sur google animation javascript debutant et tenter de reproduire ce que tu trouveras. Ou t'entrainer a manipuler les éléments du dom.
Bonjour à tous ! Je viens à vous aujourd'hui car je galère au dernier chapitre du cours (https://openclassrooms.com/fr/courses/6175841-apprenez-a-programmer-avec-javascript/exercises/3801) ! Je suis assez persuadé que j'ai oublié une broutille, mais voilà, j'ai crée la class "Book", son constructor, j'ai crée mes 3 instances à partir de ce constructor, et j'ai aussi crée la méthode d'instance "readbook".
Mais le premier problème, c'est qu'aucun de mes 3 instances (donc de mes livres) n'apparaissent à l'écran ! Je suis vraiment sûr d'avoir fait une faute banale quelque part, ou peut-être même un truc qui sauterai aux yeux, mais vraiment, je ne trouve pas l'anomalie.
Je me suis aussi demandé quelle fonction faisait apparaitre les livres dans le navigateur virtuel, je me suis donc demandé si il fallait que je créer la fonction moi-même, puis après je me suis simplement dit que ça se passait ailleurs, et que par conséquent, ayant effectué toutes le opérations demandées, il y avait sans doute une faute quelque part !
Je vous envoi quand même un screen pour éclairer les lanternes de tout le monde, en espérant que vous pourrez, ne serait-ce que m'aguiller là-dessus ! Au plaisir !
Peut-on trouver un emploi rien qu'avec du vanilla Javascript ? Je veux dire que si je n'ai aucune connaissance préalable en ce qui concerne les frameworks. Pouvez-vous me donner vos avis ?
Salut, tu as très peu de chance de trouver un travail en JS pur, de temps en temps il y a des offres, mais elles sont plutôt rare, et généralement ce n'est pas le mieux payé, car c'est plutôt de l'intégration HTML/CSS avec un peu de JS.
Perso, j'ai perdu un an à vouloir me concentrer que sur le JS Vanilla pour rien. Si c'était à refaire, j'irais directement vers un framework, l'apprentissage d'un framework est aussi long que d'apprendre le JS pur en realité, et dans un framework, 80% du JS vanilla n'est pas utilisé.
Ce qu'il faut maitriser du JS avant d'apprendre un framework, ce sont toutes les méthodes des tableaux, la manipulation des objets et l'asynchrone, toute la partie manipulation du DOM se fera entièrement via les outils du framework.
Salut, c'est juste une astuce pour transformer ton nombre en type "string".
En effet si tu utilises "+" en JS, ca peut faire 2 choses: si c'est des nombres, il va faire une addition, sinon il comprend qu'il doit concaténer les 2 valeurs. Et en toute logique, on ne peut pas faire une addition entre une chaine de caractère et un nombre, donc il va concaténer le tout, et comme la chaine de caractère est ici un espace vide "", ca revient à transformer en string.
Je débute en javascript et en HTML. Je voudrais que ma page affiche des boutons. Je ne veux pas simplement intégrer un "input type = button" dans mon code html.
Je m'explique. En javascript, j'ai créé un tableau avec des objets. Je voudrais avoir une sorte de fonction qui permet de créer des boutons affichant le titre (une des clés des objets) de ces objets. Donc cette fonction afficherait x boutons selon le nombre d'objets.
C'est assez compliqué pour moi d'expliquer car je suis débutant,j'espère que j'ai été clair dans ma demande et que l'on sera m'aidé. Merci d'avance
Je n'ai pas bien compris mais pour le fait de generer le meme nombre de boutton que de champ dans l'objet la fonction pourrait prendre en paramètre l'objet en question ensuitr avec une boucle for el in monobjet
j'ai une autre question... Je suis bloqué car je ne trouve pas le moyen de faire apparaître une vidéo lorsque je clique sur un bouton. Comment faire pour que lorsque je clique sur un bouton, ma vidéo apparait et se lance automatiquement?
J'aurais aussi besoin d'aide pour le dernier exercice du cours svp
Chez moi les livres apparaissent bien, j'ai bien le message d'erreur quand j'entre une mauvaise valeur, et les livres apparaissent bien en "lu" quand je rentre le nombre de page exact... Mais je ne reçoit pas le message avec le mot de passe pour valider mon chapitre une fois les 3 livres lus
J'ai essayé sur Firefox, Chrome et Opéra, je comprends pas d'où ça vient... Quelqu'un peut m'aider ?
export class Book {
constructor (title, author, description, pages, currentPage, read){
this.title = title;
this.author = author;
this.description = description;
this.pages = pages;
this.currentPage = currentPage;
this.read = read;
}
readBook(page) {
if (page < 1 || page > this.pages) {
return 0;
} if (page > 0 && page < this.pages){
this.currentPage = page;
return 1;
} if (page == this.pages) {
this.currentPage = page;
this.read = true;
return 1;
}
}
}
const livre1 = new Book ("Le livre sans nom", "Inconnu", "Un livre mystérieux.", 150, 10, false);
const livre2 = new Book ("Moby Dick", "Un vieux pécheur", "Une histoire de pêche.", 300, 182, false);
const livre3 = new Book ("Télérama", "Dieu", "Un grand classique", 15, 3, false);
export const books = [livre1, livre2, livre3];
j'ai une autre question... Je suis bloqué car je ne trouve pas le moyen de faire apparaître une vidéo lorsque je clique sur un bouton. Comment faire pour que lorsque je clique sur un bouton, ma vidéo apparait et se lance automatiquement?
Merci
Bonjour alors la question date un peu mais je ne l'avais pas vu. Alors ca depend il y a deux manières soit la video est deja dans le dom donc quelque part dans votre html et vous l'avez cacher en css soit au depart elle n'est pas du tout dans le dom.
Je vais traiter la deuxième possibilité car c'est la plus complexe des deux même si rien de bien méchant.
Alors vous placer un listener au click du boutton en question
vous faite un document create element video
la variable qui contiendra la video vous lui affecter le lien de la video avec
var.src="lien"
ensuite pour lancer la video ce qui va dependre du navigateur et des autorisations que l'utilisateur a défini vous faites un coup de setattribute avec comme name autoplay et value true par exemple
puis comme vous savez le faire vous faites un append de la video où il faut
Supercocotte a écrit:
Bonjour,
J'aurais aussi besoin d'aide pour le dernier exercice du cours svp
Chez moi les livres apparaissent bien, j'ai bien le message d'erreur quand j'entre une mauvaise valeur, et les livres apparaissent bien en "lu" quand je rentre le nombre de page exact... Mais je ne reçoit pas le message avec le mot de passe pour valider mon chapitre une fois les 3 livres lus
J'ai essayé sur Firefox, Chrome et Opéra, je comprends pas d'où ça vient... Quelqu'un peut m'aider ?
export class Book {
constructor (title, author, description, pages, currentPage, read){
this.title = title;
this.author = author;
this.description = description;
this.pages = pages;
this.currentPage = currentPage;
this.read = read;
}
readBook(page) {
if (page < 1 || page > this.pages) {
return 0;
} if (page > 0 && page < this.pages){
this.currentPage = page;
return 1;
} if (page == this.pages) {
this.currentPage = page;
this.read = true;
return 1;
}
}
}
const livre1 = new Book ("Le livre sans nom", "Inconnu", "Un livre mystérieux.", 150, 10, false);
const livre2 = new Book ("Moby Dick", "Un vieux pécheur", "Une histoire de pêche.", 300, 182, false);
const livre3 = new Book ("Télérama", "Dieu", "Un grand classique", 15, 3, false);
export const books = [livre1, livre2, livre3];
Bonjour, vu qu'on ne va pas forcément aller lire le cours pour savoir de qulle exercice il s'agit pourriez vous nous donner la consigne de l'exercice en question,?
J'ai déjà suivi la vidéo de correction donné par NadfriJS, j'ai relu mon code mais je n'arrive pas à voir d'où peut venir le problème...
Et voici l'énoncé de l'exercice au cas où :
Aidez à créer une application de suivi de livres pour les lecteurs !
Compétences évaluées
Écrire du code propre et facile à maintenir à l'aide de méthodes en JavaScript
Description
Comment compléter cette activité
Cette activité est une super opportunité pour mettre en pratique certains éléments importants de ce que vous avez appris pendant ce cours, et de voir comment ces éléments peuvent être utilisés dans une vraie application. Pour suivre l'activité, rendez-vous sur cet exercice interactif Next.tech et suivez les instructions. Ecrivez sur le fichier Book.js pour remplir les tâches demandées. Actualisez la page sur le navigateur intégré pour voir vos changements prendre forme.
Quand vous aurez accompli ces tâches, le navigateur intégré devrait afficher une alerte qui contient un mot. Ce mot est la réponse à la seule question dans ce quiz !
Votre mission, si vous l'acceptez
Voici ce que vous devrez faire dans cet exercice. Vous retrouverez les instructions sur l'exercice Next.tech.
Suite à votre travail sur le site de streaming, on vous demande de créer une app appelée RestfulReading, qui permettra aux utilisateurs de suivre les livres qu'ils sont en train de lire/qu'ils ont lus.
Votre tâche est de créer la classe Book (Livre) et de peupler la base de données de développement de trois ou quatre livres pour vous assurer que l'interface fonctionne correctement (vous travaillerez avec le fichier Book.js ).
La classe Book doit contenir les champs suivants :
title - string - le titre du livre
author - string - l'auteur du livre
description - string - une description du livre
pages - number - le nombre total de pages
currentPage - number - la page où se trouve l'utilisateur actuellement (entre 1 et pages )
read - boolean - si l'utilisateur a lu ou non le livre (par défaut: false )
La classe Book doit aussi contenir la méthode instance suivante :
readBook(page)
permet à l'utilisateur de dire à quelle page il se trouve actuellement
si l'argument page est inférieur à un ou supérieur au nombre total de pages du livre, readBook retourne 0
si l'argument page est supérieur ou égal à 1 et inférieur au nombre total de pages du livre, readBook modifie le champ currentPage de l'instance pour être égal à la valeur de l'argument passé, et retourne 1
si l'argument page est égal au nombre total de pages du livre, readBook modifie le champ currentPage de l'instance pour être égal à la valeur de l'argument passé, modifie le champ read de l'instance en true , et retourne 1
Quand vous aurez créé la classe Book , vous en créerez au moins trois instances valables et vous les mettrez dans le tableau books qui est exporté par Book.js . Pour vérifier votre travail, actualisez le navigateur Codevolve intégré : vos instances Book devraient être visibles dans le carousel de l'interface RestfulReading.
Pour tester votre méthode instance readBook , suivez ces instructions pour trois livres (sans rafraîchir la page) :
mettez à jour la page actuelle avec une page valable qui est inférieure au nombre total de pages
mettez à jour la page actuelle avec exactement le nombre de pages total du livre (le livre devrait disparaître du carousel et apparaître dans la liste "Lus")
- Edité par Supercocotte 22 novembre 2021 à 18:05:37
Re bonsoir alors pour le coup je l'ai refait en entier et ca marche bien mais il n'y a écris nulle part une question de mot de passe ou autre
Up: je viens de relire il y a bien marqué qu'après avoir répété l'opération pour le quiz un mot devrait apparaître mais rien je vais essayer de voir ce qui ne vas pas!
Re up: le mot qui est apparu est 'chiots' enfait j'ai ouvert le petit navigateur dans une autre fenêtre il faut que cliquiez vous voyez vous avez le boutton pour recharger la page puis au mileu il y a écris localhost et bien à droite de localhost vous cliquez là pour ouvrir dans une nouvelle fenêtre et vous faites ce qui était demandé pour les trios livres après c'est bon
export class Book
{
constructor(title,author,description,pages,currentPage,read)
{
this.title = title;
this.author = author;
this.description = description;
this.pages = pages;
this.currentPage = currentPage;
this.read = read;
}
readBook(page)
{
if(page < 1 || page > this.pages)
return 0;
else if(page >= 1 && page < this.pages)
{
this.currentPage = page;
return 1;
}
else if(page == this.pages )
{
this.currentPage = page;
this.read = true;
return 1;
}
}
}
let b1 = new Book("One piece","Eichiro Oda","Un des meilleurs mangas existant",1000,0,false);
let b2 = new Book("Dragon ball z","Akira toriyama","L'initateur de l'ère manga",2000,10,false);
let b3 = new Book("Dernier livre","Supercocotte","Son dernier exercice openclassromm",10,0,false);
export const books = [b1,b2,b3];
Je déterre peut-être un sujet déjà traité quelque-part dans les 66 pages de ce topic, mais ne l'ayant pas trouvé, je me permet de le soumettre ici.
Dans le premier chapitre de la troisième partie du cours, sur les fonctions, l'exercice proposé pour travailler est de faire une fonction pour faire la moyenne des notes données aux différentes séries de la pages.
la correction fait appel à une fonction fléchée dont la syntaxe est très différente de celle vue précédemment, et j'avoue avoir galéré à la comprendre.
const calculateAverageRating = (ratings) => {
if(ratings.length === 0) {
return 0;
}
let sum = 0;
for (let rating of ratings) {
sum += rating;
}
return sum / ratings.length;
}
j'ai donc creusé un peu, et la suite qui permet d'afficher les résultats m'a surpris : l'affichage fait bien appel à la fonction "calculateAverageRating", mais fait une différence de traitement entre les 2 premiers films qui ont déjà des votes, et le 3eme dont la constante "claraRatings", le tableau pouvant intégrer ses notes, n'est même pas créée.
Là aussi j'ai pas tout compris, comme l'intéret de la boucle...
if (tauAverage && colinAverage) {...}
Après beaucoup de tâtonnements et de messages d'erreur, je soumet à votre jugement 2 versions du code réécrit de manière - plus - lisible par des débutants comme moi.
La première fait appel quasiment exclusivement à des boucles et des déclarations de variable qui ont déjà été vues dans le cours (sauf la partie communication avec le fichier HTML). Son principal défaut est qu'elle est bien plus lourde que la solution apportée initialement, et elle doit avoir des vices cachés. De plus, elle ne gère pas l'absence de note directement dans la fonction.
// ======================
function calculateAverageRating (ratings) {
let sum = 0;
for (let rating of ratings) {
sum += rating;
}
return sum / ratings.length;
}
// ======================
const tauRatings = [5, 4, 5, 5, 1, 2];
const colinRatings = [5, 5, 5, 4, 5];
const claraRatings = [];
const tauAverage = calculateAverageRating(tauRatings);
const colinAverage = calculateAverageRating(colinRatings);
const claraAverage = calculateAverageRating(claraRatings);
let isThereRatings = true;
if (tauRatings.length == 0){
isThereRatings = false;
}
switch (isThereRatings){
case true :
document.querySelector('#tau-score').innerText = tauAverage.toFixed(1) + ' stars';
break;
case false :
document.querySelector('#tau-score').innerText = 'not rated yet';
break;
}
isThereRatings = true;
if (colinRatings.length == 0){
isThereRatings = false;
}
switch (isThereRatings){
case true :
document.querySelector('#colin-score').innerText = colinAverage.toFixed(1) + ' stars';
break;
case false :
document.querySelector('#colin-score').innerText = 'not rated yet';
}
isThereRatings = true;
if (claraRatings.length == 0){
isThereRatings = false;
}
switch (isThereRatings){
case true :
document.querySelector('#clara-score').innerText = claraAverage.toFixed(1) + ' stars';
break;
case false :
document.querySelector('#clara-score').innerText = 'not rated yet';
break;
}
la 2eme un peu simplifiée, et gère l'absence de note directement dans la fonction, mais fait appel à l'opérateur "typeof" que j'ai trouvé en farfouillant sur le net, et que l'on a pas encore vu dans le cours.
// ======================
function calculateAverageRating (ratings)
{
let sum = 0;
if(ratings.length === 0)
{
return "Not rated yet";
}
else
{
for (let rating of ratings)
{
sum += rating;
}
return sum / ratings.length;
}
}
// ======================
let tauRatings = [5, 4, 5, 5, 1, 2];
let colinRatings = [5, 5, 5, 4, 5];
let claraRatings = [];
const tauAverage = calculateAverageRating(tauRatings);
const colinAverage = calculateAverageRating(colinRatings);
const claraAverage = calculateAverageRating(claraRatings);
if (typeof(tauAverage) === "number"){
document.querySelector('#tau-score').innerText = tauAverage.toFixed(1) + ' stars';
}
else
{
document.querySelector('#tau-score').innerText = tauAverage; }
if (typeof(colinAverage) === "number"){
document.querySelector('#colin-score').innerText = colinAverage.toFixed(1) + ' stars';
}
else
{
document.querySelector('#colin-score').innerText = colinAverage;
}
if (typeof(claraAverage) === "number"){
document.querySelector('#clara-score').innerText = claraAverage + ' stars'
}
else
{
document.querySelector('#clara-score').innerText = claraAverage;
}
Bref, dites-moi ce que vous en dites, et en quoi la forme des fonction fléchées est plus adaptée ici (car je me doute que si c'est celle qui a été choisie, c'est qu'il y a une bonne raison)
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
yasakani no magatama
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
yasakani no magatama
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
La meilleure solution est toujours la plus simple. Ma chaîne Youtube [Tutos pour débutants]
yasakani no magatama
yasakani no magatama
yasakani no magatama
yasakani no magatama
yasakani no magatama