Links de utilidades/herramientas para desarrollo web

Índice:

  1. Manejo de imágenes
  2. Manejo de videos
  3. Manejo de fuentes
  4. Herramientas para diseño Responsive
  5. Recursos para React
  6. Recursos API web
  7. Recursos Aprendizaje
  8. Componentes UI
  9. Servidores para deploy

Manejo de imágenes:

  • Compresor de imagenes: Squoosh App
    • Utilizar formato webp para optimizar imágenes para web.
  • Coleccion de vectores e íconos SVG: SVG Repo
    • Permite editar y desacargar una amplia colección de vectores e íconos svg.

Manejo de videos:

  • YouTube Lite web component: Lite Youtube Web Component
    • Permite cargar videos de YouTube de forma asíncrona y mejorar el rendimiento de la página respecto a un iframe.

Manejo de fuentes:

Herramientas para diseño Responsive:

  • Responsively App: Responsively App
    • Permite visualizar la web en diferentes tamaños de pantalla simultaneamente.

Recursos para React:

  • Use Hooks: useHooks
    • Colección de custom hooks que abstraen funcionalidades comunes en React.

Recursos API web:

  • View Transition API: View Transition Examples
    • Colección de ejemplos de transiciones de vistas con view transition API.
    • Verificar si el soporte nativo ya está disponible en el navegador. View Transition Support
  • JSON Placeholder: JSON Placeholder
    • API para consumir en pruebas de desarrollo, tiene posts, comments, etc.

Recursos Aprendizaje

  • Dev Tools TIPS: DevToolsTips
    • Un blog con tips de uso de las herramientas de desarrollo de los navegadores.
  • JS Challenger: JSChallenger
    • Colección de más de 180 ejercicios de JS para poner a prueba el manejo del lenguaje.

Componentes UI

  • UI Verse: UIVerse
    • Colección con componentes UI para cualquier proyecto hechos con CSS.
  • Material UI: MUI
    • Biblioteca con componentes UI para React con base en Material Design.
  • Ant Design: ANTD
    • Biblioteca con componentes UI para React, liviana y fácil de utilizar.

Servidores para Deploy

  • Fl0 (backend): fl0
  • Render (backend, frontend, docker): render
  • Fly IO (fullstack): fly
  • Koyeb (backend, docker): koyeb
  • Qoddi (backend): qoddi
  • Netlify (frontend): netlify
  • Vercel (frontend): vercel