SEO con React y Deploy integrado con GitHub

[@midudev]

SÍGUEME: ► Instagram: instagram.com/midu.dev ► Twitter: twitter.com/midudev

[@VacKusaI]

Excelente explicación sobre el SEO con React. Siempre tuve el miedo de que las apps hechas con esta librería fuesen ineficaces al renderizarse solo al cargar el script, y esto me anima mucho a seguir investigando y conociendo sobre cómo desarrollar apps cada vez mejores.

[@emilianonegro7981]

haces que React sea muy divertido, nose si a otros les pasa pero esto de aprender programacion me divierte, parece un video juego

[@nundavid99]

10/10 las secciones dentro del video y los capitulos, veo que la UI de KZbin cambio un poco y se ve genial, aparte de ser muy intuitivo el contenido se hace muchisimo mas facil de seguir y llegar a la seccion que necesitas con esas herramientas. Se nota y se valora ese trabajo @midudev !!

[@marian_tsx]

En 17:01 podes aprovechar en usar "finally()" asi no repetis codigo. Dentro de finally haces el `setIsLoading(false)`. Siempre se va a ejecutar lo que este dentro de finally para bien (success) o para mal (error).

[@arielcastillo7925]

Midu son un amor de persona, gracias por compartir tus conocimientos ♥

[@georgieduarte2474]

super agradecido por estos live. De nuevo gracias por compartir tus conocimientos

[@midudev]

Muchas gracias por comentar Georgie!!!

[@fjdeveloper]

Muy bien explicado. Gracias. Se aprende mucho con tus videos.

[@midudev]

Muchas gracias Francisco!!!

[@miguelyoutube100]

Muy buen vídeo para aprender sobre SEO en React. Gracias Midu 😊

[@peruchodev]

Excelente explicación Migue... Formidable el hooks que creaste, la idea sera ampliarlo para que soporte todo los meta e incluso los link o cuarquier otra etiqueta que tengas en el head, gran idea has tenido, ya que de esa forma no ocuparías react-helmet o react-head, claro esta usando el hook responsablemente. - Nuevamente gracias y excelente video

[@elcocolizo]

Brutal clase, mi app va quedando de 10

[@williamromerovela]

¡Gracias por este gran video!

[@midudev]

Con gusto William!!!!

[@thesaulo14]

Exitos y mucha salud, gracias por compartir conocimiento y tu experiencia.

[@midudev]

Muchas gracias Yonathan! Un abrazaco!

[@angeltigua4014]

Bien explicado, un saludo desde Ecuador!

[@SonGoku-pc7jl]

Muchas gracias Midu, buen truco lo de Helmet y todo lo que explicas. Vi también tu conferencia de dynamic rendering, hidratación etc etc. Tienes clases donde expliques el paso a paso para aplicar cada tecnica con los modulos que creaste?

[@manuekle]

27:56 empezar seo

[@chespi44]

Bravo Crack sigue asiendo videos asi.

[@midudev]

Gracias Edgar! Eso haré! 👏

[@elProdigio]

¡Mil gracias, crack!

[@midudev]

Un placer 🤗

[@fabiandaza8263]

Estoy utilizando helmet para cambiar dinamicamente los titulos en unos articulos de blog, me cambia los titulos pero al compartir el link me genera la vista previa con el title del index y no del articulo. a alguien le ha sucedido ago similar ?

[@thesaulo14]

Me gustaria que toques algo de next.js , gracias y exitos.

[@midudev]

Lo tengo pendiente y seguramente me anime a hacer un pequeño curso!

[@thesaulo14]

@@midudev gracias .. exitos y mucha salud.

[@jorgellanque7704]

Grande Midu

[@midudev]

🤗

[@parapelo4943]

Hola, podrías decirme que usaste para ponerle SEO A adventjs?

[@MauricioRoss]

Hola Midudev, consulta, al levantar un proyecto en prod, el hook para useSEO que utilizas crees que funcione en el buscador?

[@bryanrichardi7160]

Este video sigue siendo funcional a día de hoy ? con vite ?

[@lcarlosdev]

Hola, veo este video recien. Al compartir una url no se ven los metas title ni description, es posible configurar esto sin hacer un ssr. Helmet es genial para cambiar los metas el problem es que solo se ven en el inspector pero en la card que se hace al compartir no se ven estos detalles. Hay forma de hacerlo desde el cliente?

[@theframeworksupport7393]

El tema de prerendering en un hosting compartido de php tradicional es complicado no?. Se necesitaria node como backend?

[@midudev]

Hay servicios externos que pueden hacer pre-rendering de tu app como prerender.io/. Así lo podrías usar en servidores con PHP.

[@midudev]

Tienen hasta un middleware para Laravel: github.com/JeroenNoten/laravel-prerender

[@theframeworksupport7393]

@@midudev gracias por la info

[@theframeworksupport7393]

@@midudev es necesario tener instalada la extension v8js y mi hosting (ionos) no la tiene :(

[@rubeng.villar879]

Para recuperar el title por defecto podrias guardarlo en una constante y luego usarlo solo cuando se desmonta. en .env.local .env para local y producion podes usar estos archivos en la raiz del proyecto y llamarlo en los archivos con `${process.env.APP_REACT_TITLE} | Giffy`

[@midudev]

Hola Rubén! Buena idea! :) Me parece una forma muy interesante de recuperar el title por defecto! 👏

[@andresianorock]

Midu, si tengo mi app en un contenedor de docker, afecta el SEO?

[@karsonchik]

Hace poco encontramos el siguiente problema con el tema SEO, si no es Server Render, no tiene en cuenta los titulos, descripciones y etc... y se pierde el posicionamiento. Es decir, para el posicionamiento necesita tener los titulos y descripciones ya precargados... ¿Sabes como solucionarlo a parte de Server Render? Un saludo y buen video.

[@itziarzg7524]

Gracias Miguel. Ahora que ha pasado un tiempo, ¿piensas igual de react-helmet vs react-head? Ya sé qué mejor en NextJS,jeje

[@elmermartinez]

La Polera de Hombre de Arena DE spider man

[@sergioserrano4342]

Midudev que te parece recoil como alternativa a redux y como algo con mas rendimiento que el context?

[@midudev]

Hola Sergio! Recoil me parece una alternativa muy interesante pero está muy verde todavía. En el propio repositorio se ve como están descubriendo todavía problemas u oportunidades que les ofrece la librería. Para experimentar con ello puede estar bien pero creo que para un proyecto real no lo usaría todavía. Pero está bien no perderle el ojo!

[@VacKusaI]

A ver si llegamos a los 100.000 subs!

[@midudev]

🤞

[@Yarelosa]

Hola ! hay alguna forma de que para el SEO, genere un sitemap utilizando react-router?

[@angele.t.2528]

con react-snap

[@JeffMaskhera]

Esta muy bueno, pero una pregunta cuando haces deploy y compartes el archivo en facebook, creo que no sirve de mucho, ya que facebook twitter no ejecutan Javascript al inicio y se pierden las imagenes y el SEO, no se si tienes una solución para esto en React

[@angele.t.2528]

Posterior al deploy en vercel, cuando analizas el sitio web con algún checker de tags, no se muestran por ende tampoco google las interpreta ¿alguna solución?

[@jorgericaldi6438]

el problema con el seo, es que todo bonito con google, pero para redes sociales no funciona helmet. Entonces te obliga a usar cosas como next.js o en mi caso lo que hice fue que nginx detecte el agent y que ejecute un servicio que me arma un dom solo para redes sociales y google

[@angelfigueroa6662]

Yo tengo un error al hacer deploy en vercel, si pongo la url directamente con el search/algo me dice 404, pero si lo hago desde el home si funciona, he leido que tiene algo que ver con el .htaccess pero veo que en todo el tutorial no lo haces amigo, alguna idea de qué es mi error?

[@jorgemiranda2592]

Cuando hacemos algo con GraphQL ??

[@midudev]

Ya tengo una serie de vídeos para aprender GraphQL desde cero en el canal pero no descarto que volvamos a verlo. :)

[@colommbiano]

alguna pagina que actualmente este desarrollada con React y que tenga SEO. puedes pasar algún link gracias

[@midudev]

www.fotocasa.es

[@colommbiano]

@@midudev muchas gracias profesor

[@RevampWorkshop]

Que plugin usa para mostrar los errores en el codigo?

[@Fran-kb2wi]

error lens

[@carsdfj]

iba bien en el deploy directo con vercel cli hasta que lo intente deployar desde un repositorio de github despues de un rato me di cuenta que el error que daba vercel era el siguiente Expected linebreaks to be 'CRLF' but found 'LF' linebreak-style resulta que en vscode tiene auto el end of line y me lo puso por alguna razon a LF y despues de instalar el eslint como tengo windows configure todo para windows y me salia siempre un warning mientras escribia pero no le preste atencion y simplemente lo desabilitaba en cada archivo alguien sabe por que directo por comando si me funciona como si nada pero desde el repositorio marca el error? ya configure el project en el vscode pero aun haciendo nuevos push no me agarra

[@brandotcom6942]

utilizar meta tags para el SEO o next js que dicen muchachos??