Bagaimana saya menghasilkan Portfolio saya

---

Idea

Saya pernah mempunyai about.me yang disertakan dalam tandatangan e-mel saya. Saya mengemas kininya dari semasa ke semasa, tetapi ia tidak mempunyai pautan yang ingin saya tambahkan. Pada masa itu, linktree dan carrd bukanlah sesuatu yang penting, dan walaupun begitu, saya masih suka menambah projek yang telah saya usahakan entah bagaimana. Fungsi portfolio asas, sekurang-kurangnya pautan dan beberapa teks "tentang saya", juga harus berfungsi tanpa JS.

---

Tema

Getaran santai Silent Hill menemani saya semasa sesi pengekodan COVID; Saya rasa B.G.M., fon dan skema warna adalah semua yang saya perlukan. Walaupun saya ingin mencipta skema warna, teori warna bukan bidang saya. Lawatan pantas ke penyejuk telah berjaya. Untuk muzik, saya belum boleh mengupah Akira Yamaoka, tetapi saya mempunyai jam deadeyejam untuk orang mati sebagai jam untuk orang mati jamming untuk orang mati (terima kasih!).

Saya mungkin akan menambah grafik tidak lama lagi, tetapi buat masa ini ini dan mempelajari alatan akan membantu.

---

Alatan

HTML

Asas untuk mengetahui cara enjin carian membaca dokumen HTML membantu enjin menentukan bahawa halaman mempunyai maklumat yang berkaitan. Daripada , pergi s, headers (

,

, ...), , ...

Dalam projek ini, saya perlu mencuba

. Ia masih memerlukan JavaScript untuk berfungsi. Pada pendapat saya, mempunyai teg "dialog" adalah lebih baik daripada memakan lapisan

untuk pencuci mulut. Kalau search engine boleh rasa, mungkin macam ni entahlah.

membenarkan meringkaskan butiran tanpa JS. Dengan penggayaan lanjut, ini sesuai untuk saya.

CSS / SASS

Versi Webkit pertama portfolio mengendalikan SASS hingga CSS untuk memenuhi keperluan tanpa JS. Semasa saya memindahkan ke React, terdapat proses pilihan tambahan untuk memilih beberapa fail SASS untuk menjadi lembaran gaya statik.

Saya terfikir untuk menyemak cara menggunakan %PUBLIC_URL% React dalam helaian gaya luaran supaya helaian gaya statik tidak menjadi pilihan. Buat masa ini, pengendalian helaian gaya statik pilihan akan dilakukan.

Bertindak balas

Membahagikan portfolio kepada komponen adalah wajar kerana ia akan menjadi kebanyakannya senarai maklumat, seperti pautan, item portfolio dan kemahiran.

Senang juga mengetahui bahawa komponen React boleh mempunyai Lembaran Gaya Modul mereka sendiri, tetapi untuk memasukkan beberapa gaya komponen dalam lembaran gaya statik, modul gaya perlu diimport ke fail SASS utama.

Halaman Github

Hanya hos mudah untuk halaman pendaratan 3 keping, serta aset halaman.

Supabase

Portfolio perlu mempunyai sumber maklumat entah bagaimana. Dengan Supabase, saya sudah mempunyai pentadbir web untuk pangkalan data, stor fail dan API sudah pun berada dalam awan! Terdapat sedikit keluk pembelajaran untuk menginginkan persekitaran pembangun setempat untuk Fungsi Edge. Bersedia untuk mengukir laluan CLI ke:

• Persediaan Docker, jika anda belum
• Memulakan projek Supabase
• Sambung ke projek Supabase anda dalam talian
• Menarik dan mencipta persediaan setempat untuk Pangkalan Data Supa
• Mengkonfigurasi Deno dalam VSCode
• Memulakan pangkalan data tempatan
• Fungsi Menulis Tepi

... Dan akhirnya Meletakkan fungsi dalam talian.

---

Hasilnya

https://github.com/rhizene/status

---

Apa Seterusnya?

• Saya sedang mempertimbangkan untuk melihat ke Next untuk menjaga helaian gaya statik, kandungan dan meningkatkan SEO.
• Grafik Tema dan mungkin logo Jenama.
• Idea pengenalan dan navigasi yang lebih baik.

Atas ialah kandungan terperinci Bagaimana saya menghasilkan Portfolio saya. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!