Recursos geniales

Aquí dejaré una lista de recursos de interés, tanto para futuro estudio o directos.

Herramientas frontend

• Formularios sin backend (formbold) - dev.to

Enlaces de interés

• Sin categoría
  • ⭐100+ Most Useful Github Repositories Every Programmer Needs
  • 6 must have chrome extensions
• HTML
  • HTML HEAD
  • HTML5 boilerplate
  • HTML Basics
  • Top 54 HTML5 interview
• CSS
  • Aprender CSS web.dev
  • blog css web.dev
  • position absolute
  • flexboxdefense
• Javascript
  • 15 array methods in javascript
  • consoles in javascript
  • looping through objects

Cursos Gratuitos

• web.dev frontend by Google
• CSS web.dev

A prácticar:

• Responsive portfolio html, css y js

APIS para prácticar

• jsonplaceholder
• pokeapi.co
• rickandmortyapi
• developer.imdb.com
• exchangeratesapi

prettierrc

.prettierrc

{
    "semi": true,
    "tabWidth": 4,
    "printWidth": 80,
    "useTabs": false,
    "singleQuote": false,
    "trailingComma": "es5"
}

vite

• alias @ src: así no te preocupas por el anidamiento de los componentes.

vite.config.js

import { defineConfig } from "vite";
import * as path from "path";
import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: [{ find: "@", replacement: path.resolve(__dirname, "src") }],
  },
});

Crear archivo jsconfig.json

• jsconfig
• intellisense viajar archivo al hacer click

{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "es6",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "exclude": ["node_modules"]
}

order class Tailwind

• order class

npm install -D prettier prettier-plugin-tailwindcss