Comment j'ai créé mon portfolio-js tutoriel-php.cn

L'idée

Avant, j'avais un about.me inclus dans ma signature électronique. Je le mets à jour de temps en temps, mais il lui manque les liens que je souhaite ajouter. À l'époque, linktree et carrd n'existaient pas, et même s'ils le sont, j'aime toujours ajouter les projets sur lesquels j'ai travaillé d'une manière ou d'une autre. La fonction de base du portfolio, au moins les liens et quelques textes "à propos de moi", devraient également fonctionner sans le JS.

Le thème

L'ambiance relaxante de Silent Hill m'accompagne lors des séances de codage COVID ; Je pense qu'une musique de fond, une police et une palette de couleurs sont tout ce dont j'ai besoin. Bien que je souhaite créer une palette de couleurs, la théorie des couleurs n’est pas mon domaine. Une visite rapide aux refroidisseurs a fait l'affaire. Pour la musique, je ne peux pas encore embaucher Akira Yamaoka, mais j'ai le jam for the dead de deadeyejam comme le jam for the dead jamming for the dead (merci !).

Je pourrais bientôt ajouter des graphiques, mais pour l'instant, cela et l'apprentissage des outils suffiraient.

...

Dans ce projet, j'ai dû essayer
. Il a encore besoin de JavaScript pour fonctionner. À mon avis, avoir une balise "dialog" est mieux que de manger une autre couche de
pour le dessert. Si les moteurs de recherche peuvent le ressentir, c'est peut-être comme ça, je ne sais pas.

Les permet de résumer les détails sans JS. Avec un style plus poussé, cela fonctionne pour moi.

CSS/SASS

La première version du Webkit du portfolio gère le SASS vers le CSS pour satisfaire à l'exigence d'absence de JS. Lors du transfert vers React, il existe un processus facultatif supplémentaire consistant à sélectionner certains des fichiers SASS pour devenir la feuille de style statique.

J'ai pensé vérifier comment appliquer %PUBLIC_URL% de React dans une feuille de style externe afin que la feuille de style statique ne soit pas facultative. Pour l'instant, la gestion facultative des feuilles de style statiques fera l'affaire.

Réagir

Il est souhaitable de diviser le portfolio en composants, car il s'agirait principalement d'une liste d'informations, telles que des liens, des éléments de portfolio et des compétences.

Il est également bon de savoir que les composants de React peuvent avoir leurs propres feuilles de style de module, mais pour inclure certains styles de composants dans la feuille de style statique, les modules de style doivent être importés dans le fichier SASS principal.

Pages GitHub

Juste un simple hôte pour une page de destination en trois parties, plus des éléments de page.

Supabase

Le portfolio doit avoir une source d'information d'une manière ou d'une autre. Avec Supabase, j'ai déjà un administrateur Web pour la base de données, un magasin de fichiers et une API déjà dans le cloud ! Il y a juste un peu de courbe d'apprentissage pour souhaiter un environnement de développement local pour Edge Functions. Soyez prêt à tracer un chemin CLI vers :

Configuration de Docker, si ce n'est pas le cas
Initialiser un projet Supabase
Connectez-vous à votre projet Supabase en ligne
Extraction et création d'une configuration locale pour la base de données de Supa
Configurer Deno dans VSCode
Démarrage de la base de données locale
Écrire la fonction Edge

... Et enfin Déploiement de la fonction en ligne.

Résultat

https://github.com/rhizene/status

Quelle est la prochaine étape ?

J'envisage de me pencher sur Next pour m'occuper des feuilles de style statiques, du contenu et améliorer le référencement.
Graphiques thématiques et peut-être un logo de marque.
Une meilleure idée d'introduction et de navigation.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Comment j'ai créé mon portfolio