nextjs roadmap

Ci-dessous, vous trouverez une feuille de route complète présentant le voyage pour devenir un ingénieur de produits Suivant.

Restez dans la boucle! Donner une étoile et regarder? Le dépôt GitHub pour être informé du contenu et des mises à jour frais.

Si vous cherchez à embaucher un spécialiste Next.js, envoyez-nous un message à [email protected].

Que signifie l'ingénieur produit?

Les ingénieurs de produits mettent l'accent sur l'ensemble de l'expérience utilisateur, mélangeant le frontend, le backend et la conception. Contrairement aux développeurs "FullStack", ils ont une compréhension large et pas profonde des technologies, les appliquant pour fabriquer des produits transparents. Ils priorisent le déploiement rapide et les commentaires des utilisateurs. Dans le spectre d'ingénierie, ils se concentrent sur les fonctionnalités centrées sur l'utilisateur. L'industrie passe du titre "Fullstack Engineer" en "ingénieur produit", mettant en évidence un rôle plus large que le simple codage.

Clause de non-responsabilité

Le but de cette feuille de route est de vous donner une idée du paysage. La feuille de route vous guidera si vous êtes confus sur ce qu'il faut apprendre ensuite, plutôt que de vous encourager à choisir ce qui est la hanche et la tendance. Vous devriez comprendre pourquoi un outil serait mieux adapté à certains cas que l'autre et que vous vous souvenez de la hanche et de la tendance ne signifie pas toujours le mieux adapté au travail

Feuille de route

Ressources

1. Fondamentaux:

   1. Réagir
   2. Manuscrit
      1. TS-RESET - Une réinitialisation CSS pour TypeScript, améliorant les types pour les API JavaScript communes
   3. Next.js (Cadres similaires: Hydrogène, Gatsby, Remix)

2. Techniques de rendu:

   1. Streaming
   2. SSG (génération de sites statiques)
   3. SPR (pré-rendu sans serveur)
   4. ISR (régénération statique incrémentale)
      1. Fixé
      2. Sur demande
   5. RSE (rendu côté client)
   6. SSR (rendu côté serveur)
   7. Mode d'aperçu

3. Styling & UI:

   1. Prérocesseurs:
      1. Toupet
      2. Postcss
      3. Moins
   2. CSS dans JS:
      1. Émotion
      2. Composants stylisés
      3. Système stylé
      4. Extrait de vanille
      5. Linaria
      6. Modules CSS
      7. Tailwindcss
   3. Bibliothèques de composants:
      1. radix-ui
      2. fourmi
      3. nextui
      4. ariakit
      5. spectre
      6. musi
      7. marguerite
      8. chakra
      9. fluentUi
      10. mante
      11. sans tête

4. Routeurs:

   1. Routeur d'application
      1. Composants du serveur
      2. Composants du client
      3. Disposition
   2. Pages router

5. Performance

   1. Hydratation
      1. Hydratation progressive
      2. Hydratation sélective
      3. Reprise
   2. Suivant / Image
   3. Suivant / script
   4. Suivant / Font
   5. Bundleanalyzer
   6. Fêtard

6. Déploiement

   1. Hébergement
      1. Vercel
      2. GCP
      3. AWS
      4. Gré
      5. Azuré
      6. Cloudflare
      7. Chemin de fer
      8. Rendre
      9. Fly.io
      10. Océan numérique
   2. Monnaie
      1. Cloudflare
      2. Nuage
      3. Keycdn
      4. Azurecdn
      5. Cloudcdn
      6. Rapidement
      7. Akamai
   3. Multizones
   4. IAC
      1. Sst.dev
      2. Pulumi
      3. Terraform

7. Gestion de l'État

   1. Zustand
   2. API de contexte
   3. Jotai
   4. Volie à outils redux
   5. Recul
   6. Xstate
   7. Mobx

8. Bundlers

   1. Webpack
   2. Turbopack

9. Essai

   1. E2e
      1. Dramaturge
      2. Cyprès
      3. Testcafe
   2. Unité
      1. Plaisanter
      2. Le plus vide
   3. Intégration
      1. Bibliothèque de tests React
   4. Visuel
      1. Livre de contes
      2. Docz
      3. React StyleGuidist
      4. Réagir le cosmos

10. Communication API

    1. REPOS
       1. Tanstack Query (fonctionne avec GraphQL aussi)
       2. SWR (fonctionne aussi avec GraphQL)
    2. Graphique
       1. Apollon
       2. Relais
       3. Urql
       4. GraphQl-Request
    3. Folie
       1. Socket.io
       2. Bien
       3. Convexe
       4. Poussoir
       5. Pubnub
       6. Base de données en temps réel de Firebase
       7. Supabase
    4. Itinéraires API / Handleurs d'itinéraire
    5. grpc
    6. trpc

11. i18n

    1. transférer le prochain
    2. lingui
    3. i18Next
    4. react-intl

12. Architecture

    1. Modulaire
    2. Conception de la fonctionnalité
    3. Monorepo
       1. Turborepo
       2. Nx
       3. Lerna
    4. Monolithe

13. Référencement

    1. prochain Seo
    2. @ vercel / og

14. Authentification

    1. Prochain
    2. Ironsession
    3. Passeport

15. Observabilité

    1. OpenTelemetry
    2. Médecin de données
    3. Nouvelle relique
    4. Sentinelle

? Conclure

Sentez-vous qu'il y a de la place pour l'amélioration dans les sections de la feuille de route? Veuillez envisager d'ouvrir un RP avec vos suggestions ou de signaler toute préoccupation via les problèmes. Nous nous engageons à améliorer continu, vous voudrez peut-être regarder / jouer ce référentiel pour les futures mises à jour.

? Contribution

Les contributions sont toujours les bienvenues! Pour contribuer, veuillez suivre ces étapes:

1. Fourk le référentiel.
2. Créez une nouvelle branche avec un nom descriptif.
3. Faites vos modifications et engagez-les.
4. Poussez vos modifications au référentiel fourchu.
5. Créez une demande de traction et nous allons passer en revue vos modifications.

? Communauté

Si vous cherchez de l'aide ou que vous souhaitez simplement partager vos réflexions sur le projet, nous vous encourageons à rejoindre notre communauté Discord. Voici le lien: https://blazity.com/discord. C'est un espace où nous échangeons des idées et nous nous aidons. La contribution de chacun est appréciée et nous sommes impatients de vous accueillir.