Fundamentos de Programaci贸n

1

Bienvenida a Platzi: 驴qu茅 necesitas para tomar el curso?

2

驴C贸mo aprender programaci贸n?

3

Crea tu primer sitio web

4

Sitios web con HTML

5

Estructura de 谩rbol en HTML

6

Instalando tu primer editor de c贸digo

7

C贸mo declarar variables y usar prompt

8

Algoritmo de piedra, papel o tijera

9

Algoritmo avanzado de piedra, papel o tijera

10

Aleatoriedad

11

Refactor del c贸digo usando funciones

12

Ciclos

13

Gana 3 veces

14

Archivos de HTML y JavaScript

15

驴Qu茅 es el DOM?

Quiz: Fundamentos de Programaci贸n

Desarrollando un juego con HTML y JavaScript

16

Maquetaci贸n con HTML

17

Secci贸n de elegir mascota

18

驴D贸nde ubicar la etiqueta script? Conectando HTML con JavaScript

19

Escuchando eventos con JavaScript

20

addEventListener

21

Manipulaci贸n del DOM

22

Enemigos aleatorios

23

Ataques en JavaScript

24

Ataques aleatorios del enemigo

25

Imprimiendo ataques del enemigo

26

驴Ganaste, perdiste o empataste?

27

Tablas de verdad

28

Creando el contador de vidas

29

驴Qui茅n gan贸 el juego?

30

Reiniciando el juego

31

Ocultando elementos HTML con JS para mejorar la UX del juego

Quiz: Desarrollando un juego con HTML y JavaScript

Estilos con CSS

32

Anatom铆a de CSS

33

Tipos de display

34

Flexbox

35

Modelo de caja

36

Im谩genes para los Mokepones

37

Estilos del bot贸n

38

Adaptando HTML al dise帽o del juego

39

Layout: t铆tulo y ataques

40

Adaptando JavaScript al dise帽o del juego

41

CSS Grid

42

Responsive Design

43

Detalles finales

Quiz: Estilos con CSS

Optimizaci贸n de c贸digo

44

Revisi贸n de c贸digo

45

Don't repeat yourself (DRY)

46

Clases y objetos

47

Clases y objetos de Mokepon

48

Arrays o arreglos

49

Objetos vs. arreglos

50

Ciclos: manipulando el DOM con iteradores

51

Declaraci贸n lenta de variables

52

Una sola fuente de la verdad

53

Mascotas aleatorias con arreglos

54

Ataques din谩micos por cada mascota: extraer

55

Renderizado din谩mico en HTML

56

Eventos de click din谩micos

57

Secuencia de ataques del enemigo

58

Iniciando el combate

59

Resolviendo el reto de condicionales

60

Optimizando el frontend del juego

Quiz: Optimizaci贸n de c贸digo

Mapa con canvas

61

Introducci贸n a canvas: dibujando con JavaScript

62

Moviendo a Capipepo hacia la derecha

63

Movimiento hacia todas las direcciones

64

Movimientos con el teclado

65

Im谩genes y personajes de fondo

66

M茅todos en las clases

67

Obst谩culos y colisiones

68

Combate entre mokepones colisionados

69

Mapa responsive

70

Botones bonitos y viewport

Quiz: Mapa con canvas

Backend: videojuego multijugador

71

驴Qu茅 es backend?

72

Instalaci贸n de Node.js y NPM

73

Terminal de comandos y Node.js

74

Servidor web con Express.js

75

HTTP, localhost, servidores y puertos

76

Express.js y fetch: API REST con JavaScript

77

JSON y POST: mokepon online

78

Transmisi贸n de coordenadas

79

Mokepones din谩micos en el mapa

80

Optimizando el mapa del juego

81

Batalla entre jugadores

82

Consumiendo la API de ataques del enemigo

Quiz: Backend: videojuego multijugador

Pr贸ximos pasos

83

Probando el juego en varios dispositivos

84

驴Y ahora qu茅 curso tomar?

No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

脷ltima oportunidad para asegurar tu aprendizaje por 1 a帽o a precio especial

Antes: $249

Currency
$189/a帽o

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscr铆bete

Termina en:

0D
6H
41M
38S

Probando el juego en varios dispositivos

83/84
Recursos

Aportes 146

Preguntas 137

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Es importante para que funcione el servidor, que el archivo html se llame index.html, de lo contrario, el servidor no lo interpretara y responder谩 con un error 404.

Para deshabilitar el seleccionado del texto en los botones se puede hacer con el siguiente codigo en css

user-select: none;

Hay que proteger al profe Juan, es demasiado bueno para este mundo.

Estuve un rato largo buscando porque me sal铆a el error 鈥渃annot get /鈥 y en la secci贸n de preguntas ya lo solucionaron.
Hasta este momento traemos el documento html con el nombre mokepon.html
Cambi谩ndolo por index.html como lo tienen en el video se soluciona y te permite entrar desde el localhost:8080 y con la direcci贸n IP tambi茅n.

YO: DESPU脡S DE ACBAR EL CURSO DE PROGRAMACI脫N B脕SICA

me estaban apareciendo este error en la consola:

GET mokepon.js net::ERR_ABORTED 404 (Not Found)

no estaba cargando el javascript

lo solucion茅 cambiando la etiqueta script en el html en vez de ./js/mokepon.js es /mokepon.js y cargo todo. Asi debe quedar:

<script src="./mokepon.js"></script>

Les dejo el juego que cree gracias a este curso, est谩 hecho sin POO porque a煤n lo estoy estudiando y lo quiero aprender bien
Cambi茅 la tem谩tica e hice que los personajes tengan 3 acciones, dos botones son de ataque y uno de cura, y cada personaje tiene diferentes stats. Espero que les guste!
https://alanjaqs.github.io/Pixefights-Game

La direcci贸n IP es una direcci贸n de cada computador que nos permite acceder a 茅ste desde otros dispositivos.
Entonces al poner https://192.168.10.116:8080 estamos accediendo al puerto 8080 del computador que tiene la direcci贸n 192.168.10.116.

IP local

En este caso, esta es una IP local, es decir, solo podr谩n usarla aqu茅llos que est茅n bajo la misma red (es decir, conectados al mismo router).

IP p煤blica

Vuestro router tiene una IP p煤blica con el que se puede acceder a vuestra red. Para comunicar puertos concretos hacemos Port Forwarding, esto es decirle al router que, cada vez que reciba una petici贸n al puerto - por ejemplo - 8080, que mande esa petici贸n a un computador concreto.

As铆 es que, configurando correctamente el router, pod茅is tener un servidor en vuestro propio hogar.

Disclaimer

No estoy seguro de si puede ser peligroso hacer 茅sto, solo lo comento como dato.

Yo en mi trabajo y junto con los que he desarrollado c贸digo, al proceso de testing le bautizamos el proceso Cletus 鈥淗acerlo a prueba de idiotas鈥 jajajja

F铆jense que el documento principal html debe estar como

index.html

Otra soluci贸n tambi茅n es ingresar a

localhost:8080/mokepon.html

Con esto le dan la direcci贸n exacta del archivo a donde desean ingresar, y listo!!

Tengo un error y me gustaria saber si alguien mas le pasa y es en termino de las coaliciones. Cuando lo hago desde el mobil, y alguien ingresa me coaliciona pero solo en el movil, pero en el mapa no se ve la coalicion.
Si lo hago ambos jugadores desde el computadior funciona normal. Podria se algo en terminos de que las pantallas son diferente y la del celular al ser mas peque帽a encuentra coalicion comparada con la del computador?

a aluien mas le sucede esto?

Para remplazar todos los "localhost"
use la opcion de visual studio code: 鈥淪elect All Ocurrences鈥

Ctrl + Shift + L por defecto

Espero los que tengan este error puede ver este comentario.

En el minuto del video 16:03 Juan logra entrar utilizando la direcci贸n IPv4 del WIFI que tiene asignado su PC, si no les funcionan hagan lo siguiente:

Primero verifiquen que su PC y otros dispositivos est茅n conectados a la misma red WIFI.

Si todav铆a no logan que funcione en otros dispositivos sigan 馃憞

Funciona con sistemas operativos Windows

Revisen el firewall de Windows, pero como se hace eso驴?

El firewall una herramienta de seguridad que previene el acceso no autorizado a una red, muchas ocasiones los antivirus lo remplazan y eso dificulta que otros otros dispositivos puedan acceder a nuestra red local.

  1. Con ayuda del buscador de Windows se dirigen a Firewall de Windows Defender
  2. Verifica si tu antivirus esta administrando esta configuraci贸n. (en mi caso es McAfee)
  3. Te diriges a tu antivirus y y buscas la opci贸n Firewall
  4. Lo desactivas.

Esto es supremamente importante:

Solo desact铆valo por un tiempo determinado, al tenerlo desactivado tu PC se encuentra vulnerable lo cual puede causar que intrusos accedan a el y se roben informaci贸n personal o en el peor de los casos que controlen tu PC.

el curoso fue genial, aun que casi al final me explota el cerebro.
es cierto que en el proyecto hay muchar areas de opotunidad que se pueden mejorar.
pero esta genial este curso

Yo logre eliminar el error de que cuando volv铆as a seleccionar un jugador los anteriores se redibujan en ubicaci贸n donde hac铆an colicion. 馃槺

Aqu铆 la prueba final! 鉂わ笍
https://mokepon-platzi.herokuapp.com/

Jejejeje Mori, con esa intro de 鈥淗OLA, te acuerdo de mi鈥, ya ni nos acordabamos鈥

Excelente curso, se ha aprendido mucho en poco tiempo. Pero muchas clases!

si los pasaron con el explorador de windows, se debe quitar js en el html. asi:
<script src="./js/mokepon.js"> </script>

y dejarlo asi:
<script src="./mokepon.js"> </script>
por ultimo cambiar el nombre a index el html no mokepon.

Todos los Cr茅ditos a @ric.arellano92!
Para evitar el error 鈥渕okepon.js:448 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 鈥榥ombre鈥)鈥 lo que hice fue agregar un if que evalu茅 si el mokepon existe o no, esta validaci贸n tambi茅n se aplica en la parte de pintar mokeponEnemigo:

//---------------------Al recuperar enemigos--------------------------
                mokeponesEnemigos = enemigos.map(function (enemigo)
                {
                    let mokeponEnmigo = null
                    if(enemigo.mokepon != undefined)
                    {
                        const mokeponNombre = enemigo.mokepon.nombre 
                        switch (mokeponNombre)
                        {
                        case "Hipodoge":
                            mokeponEnmigo = newMokepon('Hipodoge', './assets/mokepons_mokepon_hipodoge_attack.png', 5, './assets/hipodoge.png', enemigo.id)
                                break
                            case "Capipepo":
                                mokeponEnmigo = newMokepon('Capipepo', './assets/mokepons_mokepon_capipepo_attack.png', 5, './assets/capipepo.png', enemigo.id)
                                break
                            case "Ratigueya":
                                mokeponEnmigo = newMokepon('Ratigueya', './assets/mokepons_mokepon_ratigueya_attack.png', 5, './assets/ratigueya.png', enemigo.id)
                                break
                            default:
                                break
                        }

                        mokeponEnmigo.x = enemigo.x
                        mokeponEnmigo.y = enemigo.y
                    }
                        return mokeponEnmigo
                })

//---------------------------------Al tratar de pintar enemigos----------------------------------------
        mokeponesEnemigos.forEach(function (mokepon)
        {
            if(mokepon != undefined){
                mokepon.pintarMokepon()
                revisarColision(mokepon)
            }
        })

sub铆 la respuesta de @ric.arellano92 porque estuve rompi茅ndome la cabeza durante una semana y quiero que otros lo puedan solucionar, ya que desde las carpetas del curso da error. saludos!

En mi colegio nunca v铆 esa actitud en la que se tuviera un inter茅s genuino para que los estudiantes aprendieran. Gracias de verdad!

Si por alguna razon copiaron su direccion ip desde el navegador al momento de cambiar el localhost por ella, asegurense de que despues de el ultimo numero de la direccion, no haya una diagonal jajajaja

Como no debe de ser:

Como debe ser jajajaja:

Espero que al hacer la prueba me de unos 10000 platzi puntos.

Juanda es un excelente profesor, explica todo lo que coloca en el c贸digo, ojala el resto explicara igual

As铆 hab铆a solucionad, ya que hab铆a visto ese hueco.

Yo hice lo mismo que otro compa帽ero, si no selecciona mascota, sale un alert y al darle en aceptar se reinicia el juego

Si est谩n llevando adelante el proyecto desde WSL2: LEAN ESTO ANTES DE INTENTAR ABRIR EL JUEGO EN EL CELULAR.
En este video est谩 la explicaci贸n de porque es mas dif铆cil hacerlo y la forma de resolverlo:
https://www.youtube.com/watch?v=3Tkkk3ePZKo&ab_channel=EarHackerDem

ERROR Cannot GET/

Si te encuentras con este error en la secci贸n de preguntas ya lo solucionaron, te comparto la soluci贸n, es simple, hasta el momento venimos manejando el archivo mokepon.html pero en esta clase ya lo manejan como index.html, solo necesitas cambiar el nombre de este archivo y listo 馃憣

yo dejar铆a la pantalla en blanco, me gusta porque es como d谩ndole a entender al jugador que se ponga serio

Me encanta la energ铆a de Juan David jajajaja

Yo tambien me emocione cuando vi que la clase era del profe Juan 馃槉

Mi profesor favorito es Juan David. Es muy divertido aprender con el.

Juanda es el mejor profesor, explica tan bien que es imposible no entender, ojal谩 los otros profesores hubieran explicado como 茅l

Hola. simpre sale este error, pero no se por que es, y hay veses que no deja funcionar bien la aplicacion, si a alguien mas le sale confirmen.

Que alegria ver a juanito de nuevo, el viejo confiable tocayo c:

Yo que pensaba que este iba a ser un video de 鈥渇elicitaciones muchachos鈥 :麓 )

Que chevere ver otra clase del profe juan david, excelente manera de ense帽ar

Te agradezco mucho profe Juan David, evidentemente sos el m谩s joven, pero ten茅s un don para explicar de manera tan clara, y no solo eso, tu personalidad lo mantiene a uno enfocado en lo que vas a decir. Gracias.

Si no quieren que no se seleccione el texto ponen esto en el css del boton

user-select: none;

Realice el mismo juego en Vuejs, utilizando SocketIO como mecanismo de tiempo real:
Pueden jugarlo en linea con otras personas: Mokepon Vue

Hola tengo unos errores en el c贸digo.
Quien mas tiene estos errores?

Este curso empezo siendo traquilo y termino rompiendome el cerebre, aun asi nunca voy a parar de aprender!!

Tengan mucho cuidado con el orden de las carpetas, ten铆a un error y era que la carpeta 鈥減ublic鈥 estaba por fuera de la carpeta donde est谩 el archivo 鈥渋ndex.js鈥, en otras palabras, vayan a Recursos del video y verifiquen el orden de las carpetas.

yo lo que hice fue en esa parte llamar a la funci贸n de reiniciar juego despu茅s del alert.

Si no les aparece el IPv4 con wifi es porque est谩n usando Ethernet desde su pc, as铆 que desconecten su cable y conecten wifi o usen otra pc para conocer el IPv4.

Pueden consultar la IPv4 desde el cmd de windows.

Se rompi贸 todo mi c贸digo al abrirlo en localhost:8080 me presentaba el siguiente error

Lo solucione al cambiar en el Html la ruta de carpeta que contiene Js ya que al moverlo a la carpeta public la ubicaci贸n de este cambio.

cuando se da click en seleccionar sin mokepon yo solo puse un
location.reload()
y funciona

Yo lo solucione llamando a la funcion para reiniciar la partida

else {
            window.reiniciarPartida()
        }

Evidentemente la solucion de Juan es mucho mas efectiva y evita que la pagina se vuelva a cargar, pero ese fue mi intento desesperado xD

Mi soluci贸n para que no para que no se rompiera el juego cuando no seleccionamos nada fue poner:
seleccionarMascota.style.display = 鈥榝lex鈥 en la parte final del 鈥渆lse鈥. Quizas no es la mejor soluci贸n pero funcion贸 馃槂

Doy gracias a todo el equipo de Platzi por tan espectacular curso. Qued茅 maravillado y encantado. Los profesores son incre铆bles y con una actitud buen铆sima, el contenido es muy completo. Llegar hasta aqu铆 fue un reto, pero vali贸 completamente la pena. Muchas gracias.

Despu茅s pasar horas y horas buscando la forma de solucionar cuanto error surg铆a, despu茅s de ver una y otras vez las clases, puedo decir que siento satisfacci贸n al finalizar este curso. Se que aun estoy programando con las ruedas auxiliares, pero seguir茅 estudiando para mejorar mis habilidades. Gracias.

deben cambiar el nombre del archivo 鈥渕okepon.html鈥 por 鈥渋ndex,html"
y tambi茅n sacar la " mokepon.js " de la carpeta 鈥渏s鈥 para poder guardarlo en la carpeta 鈥減ublica鈥 de forma mas sencilla.
luego cambiar el script en el html a:
<script src =鈥./mokepon.js"></script>

Hay peque帽os detalles que los profes deben mencionar cuando se hacen cambios en el c贸digo, como por ejemplo cuando cambiamos de carpeta la direcci贸n del src de donde sacamos el archivo de JS cambia y eso rompe el c贸digo, as铆 como tambien que se debi贸 cambiar el nombre del archivo html para que se pudiera correr en el servidor

el primer ejercicio lo solucione llamando a la funci贸n reiniciarJuego 馃槃

 } else {
        alert('SELECCIONA UNA MASCOTA')
        reiniciarJuego()
    }

llegue muy orgullo a esta clase鈥
movi los archivos de carpeta y se rompio todo 馃槶

por si a alguien le sirve 鈥 para que el juego cargue en el celu deben quitarle la protecci贸n contra sitios no seguros , estuvo 3 horas hasta que lo descubr铆, al menos asi me funcion贸 a mi. Ahora tengo un montos de nuevos errores jeje pero ya es ese otro cuento !! un abrazo compa帽eros!

parce porque empieza as铆 un curso de programaci贸n b谩sica?

Me gustaria que a esta clase la complementen explicando como proceder para los que estamos en WSL, ya que corriendo el juego desde windows funciona perfecto pero desde la terminal de ubunto, no carga el juego con la ipv4.
Seria bueno porque me gustaria poder revisar mis proyectos tambien en el celular usando espress.static()

Hola me gustaria aportar como resolvi el problema de
鈥淐annot GET /鈥 Failed to load resource: the server responded with a status of 404 (Not Found) lo que pasa
es que el nombre de la terminal como el nombre del html
debe ser index no solo el html almenos asi es como
me funciono

Tengo un problemita con mi codigo
Al finalizar la batallas hay algunos ataques que me salen como undefined (Unas veces solo en un jugador y otra veces en ambos juagadores) ya he revisado el c贸digo y lo he comparado con el del proyecto y est谩 igual
Es el 煤nico imperfecto que tengo u.u

para los que les sucede el error 404 y les sale el mensaje: Cannot GET /. Esta es la solucion

Resulta que al configurar el servidor al crear el archivo package.json en la terminal establecimos con valores predeterminados en este caso index.html por lo que al cambiar el nombre del archivo mokepon.html a index.html lo solucina

Espero que les ayude aunque todavia desconosco como puedo cambiar ese valor predeterminado, espero ayudas tambien.

es muy frustrante que desde que empez贸 Diana estoy medio perdido porque ella no explica lo que hace, solo lo hace, como si ya entendieramos los conceptos (algo que no pas贸 con los otros porfesores). Por otro lado, en la clase 81 y 82 dej贸 de funcionar mi c贸digo pero no logro encontrar en donde est谩 el error y ahora no tengo el c贸digo guardado a como estaba antes de empezar esas clases y no lo puedo recuperar.

As铆 mismo, descargo el c贸digo que tiene Platzi en los recursos pero tampoco corre en mi navegador. Solo se rompi贸 en las 煤ltimas dos clases y eso es lo que me parece frustrante, que no lo voy a plder jugar ni mostrar a pesar de que hice todo el curso

BENDITO ERROR QUE APARECE Y NO SABER SOLUCIONARLO Uncaught (in promise) TypeError: Cannot set properties of null (setting 鈥榵鈥)
at digimon.js:462:41
at Array.map (<anonymous>)
at digimon.js:439:50

Para aquellos a quien todavia les aparece el error:

鈥淔ailed to load resource: the server responded with a status of 404 (Not Found).鈥

tienen que cambiar el nombre 鈥渕okepon.html鈥 a 鈥渋ndex.html鈥 y luego deslizar hasta donde tienen el script que carga 鈥渕okepon.js鈥 en 鈥渋ndex.html鈥 y cambiar su direccion por la nueva direccion que esta en public.

Pueden colocar entre comillas 鈥./鈥 y les sera mucho mas facil colocar la direccion.

antes:

<script src= "js/mokepon.js"></script>

ahora:

<script src= "./mokepon.js"></script>

sigo sin poder ver a ambas mascotas en dispositivos diferentes, alguna recomendacion?

Lo, siento, ya intent茅 de todo y simplemente no me funciona en mi celular, no me presiona los botones, revis茅 literalmente linea por linea comparando el c贸digo de platzi con el m铆o, todo est谩 perfecto. simplemente no funciona en mi celular. todo perfecto cuando lo abro desde localhost:8080 en la laptop

Dejo por ac谩 mis resultados!

https://github.com/alejonaranjo83/Mokepon.git

Nooo que fracaso, desde la clase 71 todo el codigo se rompio, ya no me funciona nada, la verdad explican y copian como si uno supiera ya鈥

Si alguien m谩s se estaba preguntando porqu茅 el archivo html debe llamarse index.html, encontr茅 este art铆culo que lo explica. Espero les sea de utilidad:

https://axarnet.es/blog/que-es-index-html

A mi no me pregunten como llegue hasta aca: lo voy a considerar como magia

Antes de continuar, mi soluci贸n fue solo reiniciar la p谩gina hasta que se seleccione la mascota:

 else {
    window.location.reload()
}

El juego me funciona cuando me conecto en el navegador como localhost:8080 pero cuando mi IP:8080 no me corri贸 ni en la laptop ni otros dispositivos.

Finalmente, encontr茅 que deb铆a revisar el firewall de windows pero resulto que estaba apagado pq otra aplicaci贸n lo estaba reemplazando鈥 el antivirus, al revisarlo vi que ese firewall si estaba bloqueando la red wi-fi con la que estaba conectado y al darla como segura me permiti贸 abrir el juego desde cualquier dispositivo con la IP:8080.

Por si le pasa a alguien鈥 Saludos

Despu茅s de un largo tiempo trabajando en el proyecto he logrado que funcione como a m铆 me gusta en un 80 %, ya que varias cosas no funcionan como yo quiero, por ejemplo al terminar el combate el jugador ganador regresa al mapa, al perdedor eliminar la imagen del mapa y varias cosas m谩s, lo he probado en dispositivos m贸viles y pc鈥檚 y funciona bien.
pantalla inicio

Ambos jugadores en el mapa con npc鈥檚

Al colisionar inicia atacando el jugador que provoco la colisi贸n

Turno 2

Turno 5

Al terminar el combate indica quien gano y quien perdio, desaparecen los botones y aparece el boton de reiniciar.

Las capturas la hice utilizando el modo responsive ya que si este funciona lo mas probable es que la version normal funcione tambien, lo cual asi es.
Proyecto en GitHub
https://github.com/FredyBarrantes/HtmlCssJavascript.git

Cuando pongan el ip, 8080 es solo para el celular.
en la web funciona sin el ip

hostname -I

Asi para los q utilizan Linux

Por algun motivo mi juego no funciona a la perfeccion

馃槮 Yo lo solucione desde la primera clase.

Pense que lo habian olvidado y oh sorpresa.

Les comparto mi codigo:

<    
    boton_mascota.addEventListener("click", ()=>{
        if(inputHipodoge.checked == true || inputCapipepo.checked == true || inputRatigueya.checked == true || inputLangostelvis.checked == true || inputPydos.checked == true || inputTucapalma.checked == true){
            selecionarMascotaJugador()
        }else {
            alert("Debe selecionar una mascota")
        }
    })> 

Aaaaparte modifique el codigo para quitar el boton de seleccionar, y en cambio al dar click sobre el nombre de la mascota se oculte esa parte y salga la otra pantalla. 馃槃 me parecio mas f谩cil para cuando es en mobile, directo seleccionar al dar tap a la mascota

Yo lo hab铆a echo recargando la pagina, aunque era un poco molesto fue la soluci贸n que pens茅 en el momento

location.reload()

Excelente explicaci贸n

por fin estoy terminando

Quiero decirles que solucione mi problema accediendo a mi ip:8080 de mi wifi, el problema estaba en mi firewall de windows 10, les dejo un tutorial para que puedan agregar el puerto 8080 como excepcion al firewall y de esta manera les cargue su p谩gina desde otro dispositivo a trav茅s del wifi:
.
Abre el Firewall de Windows:
.
Ve al 鈥淧anel de control鈥 de Windows y selecciona 鈥淪istema y seguridad鈥 y luego 鈥淔irewall de Windows鈥.
.
Configuraci贸n Avanzada:
.
En el panel izquierdo, selecciona 鈥淐onfiguraci贸n avanzada鈥.
.
Reglas de Entrada:
.
En el panel izquierdo, selecciona 鈥淩eglas de entrada鈥.
.
Nueva Regla:
.
En el panel derecho, haz clic en 鈥淣ueva regla鈥︹ para abrir el asistente para crear una nueva regla de entrada.
.
Tipo de Regla:
.
Selecciona 鈥淧uerto鈥 y haz clic en 鈥淪iguiente鈥.
.
Especificar Puerto:
.
Selecciona 鈥淭CP鈥 y especifica el n煤mero de puerto (8080) que deseas permitir. Haz clic en 鈥淪iguiente鈥.
.
Acci贸n:
.
Selecciona 鈥淧ermitir la conexi贸n鈥 y haz clic en 鈥淪iguiente鈥.
.
Perfiles:
.
Deja marcadas todas las opciones (Dominio, Privado, P煤blico) y haz clic en 鈥淪iguiente鈥.
.
Nombre de la Regla:
.
Asigna un nombre a la regla (por ejemplo, 鈥淧ermitir Puerto 8080鈥) y opcionalmente proporciona una descripci贸n. Haz clic en 鈥淔inalizar鈥.

necesito ayuda porque no me aparece error en la consola y tampoco me aparecen los mokepones del la segunda pesta帽a

Hola, luego de que se seleccionen los ataques en ambos dispositivos me sale este error
GET http 馃槙/192.168.0.19:800/mokepon/0.8147895793180704/ataques net::ERR_CONNECTION_REFUSED
Uncaught (in promise) TypeError: Failed to fetch
at obtenerAtaques (mokepon.js:278:5)

En mi pc uso solo conexi贸n a internet por cable Ethernet y no pude abrir mis mokepones en el celu, estaba tan emocionado

quiero aprender a conectar mi archivo html con js
si estabas usando WSL2 para crear el proyecto y quieres ejecutar el proyecto directamente sobre la IP de tu WSL2, haz los siguientes pasos: 1. Abre el cmd de tu windows. 2. Aseg煤rate que est茅s en el usuario que tienes el WSL2: `C:\Users\USER>` 3. Escribe el comando `wsl hostname -I` 4. Te mostrar谩 la ip en la que estar谩 corriendo tu WSL2. 5. Ve al navegador y escribe la ip que te arrojo, seguido del puerto. Y ya, ojal谩 te haya servido.

Hola! Mi soluci贸n para evitar que los jugadores le dieran click al bot贸n 鈥淪eleccionar鈥 antes de elegir un personaje fue:

1. Al iniciar el juego desaparecerlo con:
botonMascotaJugador.style.display = 鈥榥one鈥

2. Crear una funci贸n aparte para que luego de haber elegido el personaje, el programa acceda esta funci贸n y habilitara el bot贸n. De manera que, al hacer ahora click al boton 鈥淪eleccionar鈥, continuara la l贸gica del juego que hemos estado programando.

<function seleccion(){
    botonMascotaJugador.style.display = 'block'
    botonMascotaJugador.addEventListener('click', seleccionarMascotaJugador)
}> 
recargue la pa堑ina en el celular y no me volv铆o a cargar el juego de mokepon, 驴alguien sabe como solucionarlo? 驴Por qu茅 pasa esto?

si tienne el error 404 en la consola, deben usar el comando " node .\index.js "
en vez de " node index.js "

El juego me funciona correctamente, pero en la consola de inspeccionar del primer jugador me aparece el siguiente error cuando se une otro:
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 鈥榥ombre鈥)
at mokepon.js:615:43
at Array.map (<anonymous>)
at mokepon.js:610:32
y deja de aparecer una vez el enemigo selecciona su mascota.

Estar铆a bien una aparici贸n estelar de Juan David, porque quiero entender a que se debe, gracias.

para evitar usar dos: ontouch y onmouse , usen solamente onpointer , que tiene un uso general , onpointerup para detener movimiento y onpointerdown para mover

Ya que llegamos al final, cuanto se demoraron en completar el curso?

Ya muchos lo han dicho pero me gustar铆a igual hacer el aporte con algo m谩s.

Yo tambi茅n luch茅 con el cannot GET /, y eso se soluciona cambiando el nombre de nuestro archivo html de mokepon.html a index.html.

Sin embargo, si hicieron lo mismo que yo y sacaron el archivo mokepon.js de la carpeta js para meterla en la carpeta public, el programa estar谩 rot铆simo en el celu y el compu. Para solucionar eso, dentro del archivo html, deben ir al fondo donde est谩 script, y cambiar su contenido de 鈥./js/mokepon.js鈥 a 鈥./mokepon.js鈥. Recordar, solo hacer esto si movieron el archivo y no la carpeta, si movieron la carpeta, no pasar谩 nada raro 馃槈

creo que lo hiceun poco diferente pero me sirvio



function seleccionarMascotaJugador() {
jugar = 1

    if (inputscorpio.checked) {

        inputpersonajejugador.innerHTML = inputscorpio.id
        personajepc = inputscorpio.id

    } else if (inputcapri.checked) {

        inputpersonajejugador.innerHTML = inputcapri.id
        personajepc = inputcapri.id
    } else if (inputsagi.checked) {

        inputpersonajejugador.innerHTML = inputsagi.id
        personajepc = inputsagi.id
    } else if (inputsagicorpio.checked) {
        inputpersonajejugador.innerHTML = inputsagicorpio.id
        personajepc = inputsagicorpio.id
    } else if (inputscorcapri.checked) {
        inputpersonajejugador.innerHTML = inputscorcapri.id
        personajepc = inputscorcapri.id
    } else if (inputcapritario.checked) {
        inputpersonajejugador.innerHTML = inputcapritario.id
        personajepc = inputcapritario.id
    }
   
    else {
        jugar = 0
        alert(" debes seleccionar un personaje")
    }
    if (jugar == 1) {
 
        sectionmapa.style.display = "flex"
        sectionpersonaje.style.display = "none"
        iniciarmapa()
        extraerataques(personajepc)
        selecionarangelo (personajepc)
    }

Alguien podrian ayudarme con esto ? [Intervention] Slow network is detected. See https://www.chromestatus.com/feature/5636954674692096 for more details. Fallback font will be used while loading: chrome-extension://liecbddmkiiihnedobmlmillhodjkdmb/fonts/CircularXXWeb-Book.woff2

express.static --> permite servir archivos estaticos
ontouch --> lee los eventos tactil

Sinceramente no entiendo porque funciona cuando se le da la gana, toca como borrar cache.

Otra cosa, le falto desarrollo al juego, hay mucho bug. Por querer hacerlo multiplayer, ojala hubiera quedado completo lo dejare as铆 con las ganas de compartirlo .
player1= empate

player2=disque pierde XD


Gracias por las bases para ser full stack.

  1. Si les colisianan los enemigos entrando desde diferentes dispositivos:

Me pasaba a mi que cuando me conectaba desde el movil, y el portatil al mismo timepo, cuando seleccionaba un personaje de algun dispositivo, automaticamente detectaba colision desde el dispositivo opuesto.

La solucion es agregar una verificacion en la linea de la funcion de verificacion de colision, solo tienen que agregar esta linea:

    function checkCollision(enemy){
        if(enemy === undefined){
            return;
        }

De esta MANERA si no se detecta un enemigo, evitas que se colisione sobre si mismo

En Mac pueden usar el comando 鈥渋fconfig -a鈥. De ah铆 buscar en el c贸digo el apartado 鈥渆n0:鈥 y despu茅s 鈥渋net鈥

鉂わ笍