search
CursosEmpresasBlogLiveConfPrecios
Curso Práctico de GraphQL con JavaScript

Preparando API para producción

Curso Práctico de GraphQL con JavaScript

Contenido del curso

Introducción

  • 1
    Introducción al curso y prerequisitos del curso

    Introducción al curso y prerequisitos del curso

    01:01 min
  • 2
    ¿Qué es GraphQL?

    ¿Qué es GraphQL?

    00:15 min

Conceptos básicos

  • 3
    Schema y types

    Schema y types

    06:09 min
  • 4
    Queries y Resolvers

    Queries y Resolvers

    05:09 min
  • 5
    Sirviendo el API en la web

    Sirviendo el API en la web

    07:57 min
  • 6
    Custom Types

    Custom Types

    12:06 min
  • 7
    Argumentos

    Argumentos

    08:11 min
  • 8
    Configuración de base de datos

    Configuración de base de datos

    11:21 min
  • 9
    Integrando una base de datos

    Integrando una base de datos

    09:58 min
  • 10
    Mutations e Inputs

    Mutations e Inputs

    14:29 min
  • 11
    Repaso - Creando el tipo Estudiante

    Repaso - Creando el tipo Estudiante

    16:23 min
  • 12
    Nested Types

    Nested Types

    11:22 min
  • 13
    Resolver de tipos

    Resolver de tipos

    08:45 min
  • 14
    Errores

    Errores

    08:50 min

Conceptos avanzados

  • 15
    Alias y fragments

    Alias y fragments

    07:50 min
  • 16
    Variables

    Variables

    06:42 min
  • 17
    Enums

    Enums

    06:29 min
  • 18
    Interfaces - Tipo Monitor

    Interfaces - Tipo Monitor

    12:30 min
  • 19
    Directivas

    Directivas

    06:16 min
  • 20
    Unions

    Unions

    12:14 min

Consumiendo el API

  • 21
    Preparando API para producción

    Preparando API para producción

    Viendo ahora
  • 22
    HTTP requests

    HTTP requests

    02:43 min
  • 23
    Clientes de GraphQL

    Clientes de GraphQL

    02:29 min
  • 24
    Consumiendo el API desde un frontend simple

    Consumiendo el API desde un frontend simple

    11:05 min
  • 25
    Cierre del curso

    Cierre del curso

    01:14 min
schoolTomar examen

Preparando API para producción

Resumen

Para que nuestra API sea accesible desde cualquier lugar debemos añadir el middleware cors a express, primero debemos instalarlo con el siguiente comando:

npm i cors

Escuelas

  • Desarrollo Web
    • Fundamentos del Desarrollo Web Profesional
    • Diseño y Desarrollo Frontend
    • Desarrollo Frontend con JavaScript
    • Desarrollo Frontend con Vue.js
    • Desarrollo Frontend con Angular
    • Desarrollo Frontend con React.js
    • Desarrollo Backend con Node.js
    • Desarrollo Backend con Python
    • Desarrollo Backend con Java
    • Desarrollo Backend con PHP
    • Desarrollo Backend con Ruby
    • Bases de Datos para Web
    • Seguridad Web & API
    • Testing Automatizado y QA para Web
    • Arquitecturas Web Modernas y Escalabilidad
    • DevOps y Cloud para Desarrolladores Web
  • English Academy
    • Inglés Básico A1
    • Inglés Básico A2
    • Inglés Intermedio B1
    • Inglés Intermedio Alto B2
    • Inglés Avanzado C1
    • Inglés para Propósitos Específicos
    • Inglés de Negocios
  • Marketing Digital
    • Fundamentos de Marketing Digital
    • Marketing de Contenidos y Redacción Persuasiva
    • SEO y Posicionamiento Web
    • Social Media Marketing y Community Management
    • Publicidad Digital y Paid Media
    • Analítica Digital y Optimización (CRO)
    • Estrategia de Marketing y Growth
    • Marketing de Marca y Comunicación Estratégica
    • Marketing para E-commerce
    • Marketing B2B
    • Inteligencia Artificial Aplicada al Marketing
    • Automatización del Marketing
    • Marca Personal y Marketing Freelance
    • Ventas y Experiencia del Cliente
    • Creación de Contenido para Redes Sociales
  • Inteligencia Artificial y Data Science
    • Fundamentos de Data Science y AI
    • Análisis y Visualización de Datos
    • Machine Learning y Deep Learning
    • Data Engineer
    • Inteligencia Artificial para la Productividad
    • Desarrollo de Aplicaciones con IA
    • AI Software Engineer
  • Ciberseguridad
    • Fundamentos de Ciberseguridad
    • Hacking Ético y Pentesting (Red Team)
    • Análisis de Malware e Ingeniería Forense
    • Seguridad Defensiva y Cumplimiento (Blue Team)
    • Ciberseguridad Estratégica
  • Liderazgo y Habilidades Blandas
    • Fundamentos de Habilidades Profesionales
    • Liderazgo y Gestión de Equipos
    • Comunicación Avanzada y Oratoria
    • Negociación y Resolución de Conflictos
    • Inteligencia Emocional y Autogestión
    • Productividad y Herramientas Digitales
    • Gestión de Proyectos y Metodologías Ágiles
    • Desarrollo de Carrera y Marca Personal
    • Diversidad, Inclusión y Entorno Laboral Saludable
    • Filosofía y Estrategia para Líderes
  • Diseño de Producto y UX
    • Fundamentos de Diseño UX/UI
    • Investigación de Usuarios (UX Research)
    • Arquitectura de Información y Usabilidad
    • Diseño de Interfaces y Prototipado (UI Design)
    • Sistemas de Diseño y DesignOps
    • Redacción UX (UX Writing)
    • Creatividad e Innovación en Diseño
    • Diseño Accesible e Inclusivo
    • Diseño Asistido por Inteligencia Artificial
    • Gestión de Producto y Liderazgo en Diseño
    • Diseño de Interacciones Emergentes (VUI/VR)
    • Desarrollo Web para Diseñadores
    • Diseño y Prototipado No-Code
  • Contenido Audiovisual
    • Fundamentos de Producción Audiovisual
    • Producción de Video para Plataformas Digitales
    • Producción de Audio y Podcast
    • Fotografía y Diseño Gráfico para Contenido Digital
    • Motion Graphics y Animación
    • Contenido Interactivo y Realidad Aumentada
    • Estrategia, Marketing y Monetización de Contenidos
  • Desarrollo Móvil
    • Fundamentos de Desarrollo Móvil
    • Desarrollo Nativo Android con Kotlin
    • Desarrollo Nativo iOS con Swift
    • Desarrollo Multiplataforma con React Native
    • Desarrollo Multiplataforma con Flutter
    • Arquitectura y Patrones de Diseño Móvil
    • Integración de APIs y Persistencia Móvil
    • Testing y Despliegue en Móvil
    • Diseño UX/UI para Móviles
  • Diseño Gráfico y Arte Digital
    • Fundamentos del Diseño Gráfico y Digital
    • Diseño de Identidad Visual y Branding
    • Ilustración Digital y Arte Conceptual
    • Diseño Editorial y de Empaques
    • Motion Graphics y Animación 3D
    • Diseño Gráfico Asistido por Inteligencia Artificial
    • Creatividad e Innovación en Diseño
  • Programación
    • Fundamentos de Programación e Ingeniería de Software
    • Herramientas de IA para el trabajo
    • Matemáticas para Programación
    • Programación con Python
    • Programación con JavaScript
    • Programación con TypeScript
    • Programación Orientada a Objetos con Java
    • Desarrollo con C# y .NET
    • Programación con PHP
    • Programación con Go y Rust
    • Programación Móvil con Swift y Kotlin
    • Programación con C y C++
    • Administración Básica de Servidores Linux
  • Negocios
    • Fundamentos de Negocios y Emprendimiento
    • Estrategia y Crecimiento Empresarial
    • Finanzas Personales y Corporativas
    • Inversión en Mercados Financieros
    • Ventas, CRM y Experiencia del Cliente
    • Operaciones, Logística y E-commerce
    • Gestión de Proyectos y Metodologías Ágiles
    • Aspectos Legales y Cumplimiento
    • Habilidades Directivas y Crecimiento Profesional
    • Diversidad e Inclusión en el Entorno Laboral
    • Herramientas Digitales y Automatización para Negocios
  • Blockchain y Web3
    • Fundamentos de Blockchain y Web3
    • Desarrollo de Smart Contracts y dApps
    • Finanzas Descentralizadas (DeFi)
    • NFTs y Economía de Creadores
    • Seguridad Blockchain
    • Ecosistemas Blockchain Alternativos (No-EVM)
    • Producto, Marketing y Legal en Web3
  • Recursos Humanos
    • Fundamentos y Cultura Organizacional en RRHH
    • Atracción y Selección de Talento
    • Cultura y Employee Experience
    • Gestión y Desarrollo de Talento
    • Desarrollo y Evaluación de Liderazgo
    • Diversidad, Equidad e Inclusión
    • AI y Automatización en Recursos Humanos
    • Tecnología y Automatización en RRHH
  • Finanzas e Inversiones
    • Fundamentos de Finanzas Personales y Corporativas
    • Análisis y Valoración Financiera
    • Inversión y Mercados de Capitales
    • Finanzas Descentralizadas (DeFi) y Criptoactivos
    • Finanzas y Estrategia para Startups
    • Inteligencia Artificial Aplicada a Finanzas
    • Domina Excel
    • Financial Analyst
    • Conseguir trabajo en Finanzas e Inversiones
  • Startups
    • Fundamentos y Validación de Ideas
    • Estrategia de Negocio y Product-Market Fit
    • Desarrollo de Producto y Operaciones Lean
    • Finanzas, Legal y Fundraising
    • Marketing, Ventas y Growth para Startups
    • Cultura, Talento y Liderazgo
    • Finanzas y Operaciones en Ecommerce
    • Startups Web3 y Blockchain
    • Startups con Impacto Social
    • Expansión y Ecosistema Startup
  • Cloud Computing y DevOps
    • Fundamentos de Cloud y DevOps
    • Administración de Servidores Linux
    • Contenerización y Orquestación
    • Infraestructura como Código (IaC) y CI/CD
    • Amazon Web Services
    • Microsoft Azure
    • Serverless y Observabilidad
    • Certificaciones Cloud (Preparación)
    • Plataforma Cloud GCP

Platzi y comunidad

  • Platzi Business
  • Live Classes
  • Lanzamientos
  • Executive Program
  • Trabaja con nosotros
  • Podcast

Recursos

  • Manual de Marca

Soporte

  • Preguntas Frecuentes
  • Contáctanos

Legal

  • Términos y Condiciones
  • Privacidad
  • Tyc promociones
Reconocimientos
Reconocimientos
Logo reconocimientoTop 40 Mejores EdTech del mundo · 2024
Logo reconocimientoPrimera Startup Latina admitida en YC · 2014
Logo reconocimientoPrimera Startup EdTech · 2018
Logo reconocimientoCEO Ganador Medalla por la Educación T4 & HP · 2024
Logo reconocimientoCEO Mejor Emprendedor del año · 2024
De LATAM conpara el mundo
YoutubeInstagramLinkedInTikTokFacebookX (Twitter)Threads

Comentarios19

Jhon Manuel Angulo Moncada

Jhon Manuel Angulo Moncada

Estudiante
Hace 7 años
    Antonio Madrid

    Antonio Madrid

    Estudiante
    Hace 6 años
    Carlos Jaime Yerena

    Carlos Jaime Yerena

    Estudiante
    Hace 6 años
Noel Zenon Callapiña Angles

Noel Zenon Callapiña Angles

Estudiante
Hace 6 años
    Antonio Madrid

    Antonio Madrid

    Estudiante
    Hace 6 años
    Reinaldo Mendoza

    Reinaldo Mendoza

    Estudiante
    Hace 5 años
Walter Ugalde A

Walter Ugalde A

Estudiante
Hace 7 años
    Rubelio Cardona

    Rubelio Cardona

    Estudiante
    Hace 7 años
Juan Antonio Cuahonte Isla

Juan Antonio Cuahonte Isla

Estudiante
Hace 5 años
Fmendoza

Fmendoza

Estudiante
Hace 4 años
Nicolas Plazas

Nicolas Plazas

Estudiante
Hace 6 años
Miguel Angel Reyes Moreno

Miguel Angel Reyes Moreno

Estudiante
Hace 5 años
Alejandro Marcos Gutierrez

Alejandro Marcos Gutierrez

Estudiante
Hace 5 años
silvana murgo

silvana murgo

Estudiante
Hace 6 años
    Cesar David Ramírez Dimaté

    Cesar David Ramírez Dimaté

    Estudiante
    Hace 5 años
Fernando Cordero

Fernando Cordero

Estudiante
Hace 7 años
    Juan Jose Vega

    Juan Jose Vega

    Estudiante
    Hace 6 años
    Cesar David Ramírez Dimaté

    Cesar David Ramírez Dimaté

    Estudiante
    Hace 5 años
Walter Ugalde A

Walter Ugalde A

Estudiante
Hace 7 años
    Cesar David Ramírez Dimaté

    Cesar David Ramírez Dimaté

    Estudiante
    Hace 5 años
Cristian Iñiguez

Cristian Iñiguez

Estudiante
Hace 6 años
Nery Alberto Cano Ortigoza

Nery Alberto Cano Ortigoza

Estudiante
Hace 6 años
    Carlos Jaime Yerena

    Carlos Jaime Yerena

    Estudiante
    Hace 6 años
Sebastian Matias Pulido

Sebastian Matias Pulido

Estudiante
Hace 5 años
Mateo Loaiza Rios

Mateo Loaiza Rios

Estudiante
Hace 7 años
    Alexis Alberto Texis Auza

    Alexis Alberto Texis Auza

    Estudiante
    Hace 7 años
    Daniel Alberto De La Paz López

    Daniel Alberto De La Paz López

    Estudiante
    Hace 7 años
Juan Jose Vega

Juan Jose Vega

Estudiante
Hace 6 años
Francisco Javier Suarez Verdugo

Francisco Javier Suarez Verdugo

Estudiante
Hace 6 años
Francisco Garcia [C6]

Francisco Garcia [C6]

Estudiante
Hace 6 años
jorge llanque

jorge llanque

Estudiante
Hace 6 años

para usuarios windows usar:

"start": "SET NODE_ENV=production & node index",

Gracias! Ese fue el primer problema que tuve en Windows, solucionado!

"scripts": { "start": "SET NODE_ENV=production & node index", "dev": "nodemon -e js,graphql index",

Gracias por el dato camarada!!!

En windows el valor de process.env.NODE_ENV me daba 'production ' más un espacio, haciendo que la variable isDev nunca sea falsa. para superar lo anterior le tuve que agregar un trim, quedo de la siguiente manera.

const isDev = process.env.NODE_ENV.trimRight() !== 'production';

Les comento por si tienen el mismo problema.

Gracias! Ese fue el segundo problema que tuve, solucionado!

const isDev = process.env.NODE_ENV.trimRight() !== 'production'

Excelente solucion

Me gustaría saber cuando van a dar el curso avanzado ?

  • Seguridad ?
  • Cuando el proyecto es grande como separar los resolvers, types, schemas entre otros ?

Hola, espero lo mismo ya que en la vida real y en un proyecto grande hay muchas cosas q son necesarias

NODE_ENV en Windows

Enero 2022


Les traigo una actualización a partir las soluciones proporcionadas por mis compañeros jhon manuel angulo moncada y Nanglesc


En package.json tendremos

"scripts": { "start": "SET NODE_ENV=production & node index", "dev": "nodemon -e js,graphql index", "lint": "standard", "lint-fix": "standard --fix", "test": "echo \"Error: no test specified\" && exit 1" }

Y asegúrense de quitar el espacio de la variable NODE_ENV con trimEnd().

const isDev = process.env.NODE_ENV.trimEnd() !== 'production';

Me gustó mucho la clase 20. Excelente forma de hacer búsquedas!

Me aparece una pantalla en blanco con el siguiente error: {"errors":[{"message":"Must provide query string."}]}, cuando la llave graphiql es false, ayuda pls.

Preparando API para producción

Debemos hacer npm i cors para que nuestra API pueda ser consumida desde cualquier lado.

Para hacer que esté listo nuestro entorno en producción hacemos lo siguiente:

En index.js:

const cors = require("cors"); const isDev = process.env.NODE_ENV.trimRight() !== "production" //* Hacemos trimRight porque el NODE_ENV viene con un espacio al final, en package.json app.use(cors()); app.use('/api', graphqlHTTP({ schema, rootValue: resolvers, graphiql: isDev }));

En el package.json:

{ "scripts": { "start": "SET NODE_ENV=production & node index" } }

para apollo-server

const server = new ApolloServer({ cors: { origin: '*', credentials: true }, schema, playground: true })

1- Instalar

npm i cors
Mas info

2- En index.js agregar

const cors = require('cors')

3- Validar si estamos en modo desarrollo o produccion

const isDev = process.env.NODE_ENV !== 'production'; app.use('/api', graphqlHTTP({ schema, rootValue: resolvers, graphiql: isDev }));

5- en package.json agregamos una nuevo script que correra en para produccion

"scripts": { "start": "NODE_ENV=production node index", "dev": "nodemon -e js,graphql index.js", "lint": "standard || exit 0", "lint-fix": "standard --fix", "test": "echo \"Error: no test specified\" && exit 1" },

Excelente resumen.

{"errors":[{"message":"Must provide query string."}]}

cambio la url, tiene que estar en la url del query

Eso quiere decir que está bien. Que no se podrá ingresar al entorno gráfico GraphiQL si se levanta el servicio como si estuviera en producción.

Gracias Prof. El curso para principiantes esta bien, en realidad aporto muy poco, con respecto al que ya existia.

Lamentablemente es así. No deberían estar renovando cursos básicos si están bien, sino enfocarse a cursos avanzados y dejar los básicos como están.

Si son usuarios de Windows pueden usar cross-env para no tener problemas con las variables de entorno en los comandos:

// package.json { ..., "scripts": { "start": "cross-env NODE_ENV=production node index.js", "dev": "cross-env NODE_ENV=development nodemon -e js,graphql index.js", "test": "echo \"Error: no test specified\" && exit 1" }, ... }

Les facilito aquí la librería de cors para que puedan profundizar en la documentación

Muchas gracias compañero!!!

En windows tira error por lo que hay que agregar "SET" antes de "NODE_ENV"

"start": "SET NODE_ENV=production & node index"

Pero esto genera un espacio vacio despues del string 'production' así que simplemente agreguen ese espacio vacio y listo.

const isDev = process.env.NODE_ENV !== 'production '

Espero les sirva de ayuda

npm ERR! errno 1 npm ERR! platzi-dir@1.0.0 start: NODE_ENV=production node index.js npm ERR! Exit status 1

Prueba usando la librería cross-env

y escribe en tu script: "start" : " cross-env NODE_ENV=production node index"

Si estas usando windows, puedes instalar la librería win-node-env. **npm i win-node-env **o si lo quieres de manera global npm i -g win-node-env con esto no se tiene que modificar la línea y se ejecuta sin problemas

Usen gitbash o zsh en hyper

Muchas gracias por la sencilla y rápida explicación para usar cors instructor Adrián.

Excelente tip

npm ERR! errno 1 npm ERR! platzi-dir@1.0.0 start: NODE_ENV=production node index.js npm ERR! Exit status 1