Bekerja dengan GitHub OAuth Authentication

Hello semua,

Dalam catatan blog ini, saya akan membincangkan permintaan tarik kedua (PR) saya sebagai sebahagian daripada siri Keluaran 0.3 untuk tugasan saya. PR ini meneruskan kerja saya pada projek GitExplorer, yang pada mulanya saya sumbangkan semasa acara Hacktoberfest. Untuk keluaran minggu ini, penyelenggara projek meminta pelaksanaan fungsi pengesahan GitHub.

Gambaran keseluruhan GitExplorer

GitExplorer ialah projek yang bertujuan untuk memudahkan interaksi dengan repositori GitHub. Jika anda berminat untuk mengetahui lebih lanjut tentang projek atau sumbangan saya sebelum ini, sila lihat catatan blog saya sebelum ini untuk repositori ini.

Isu khusus yang saya tangani kali ini ialah kekurangan pengesahan GitHub dalam aplikasi. Pengehadan ini menghalang apl daripada menyediakan ciri yang diperibadikan seperti membintangi repositori. Tugas saya adalah untuk melaksanakan ciri pengesahan GitHub yang membolehkan pengguna log masuk dan log keluar menggunakan akaun GitHub mereka. Selain itu, pengguna akan dapat membintangkan repositori kegemaran mereka dan mengambil senarai semua repositori berbintang mereka dengan klik butang mudah.

Cabaran: Bekerja Tanpa Rangka Kerja UI

GitExplorer tidak menggunakan sebarang rangka kerja UI moden seperti React. Sebaliknya, ia bergantung semata-mata pada JavaScript vanila, CSS dan HTML. Walaupun kesederhanaan ini mempunyai kelebihannya, ia memerlukan saya untuk menumpukan lebih banyak masa kepada isu ini kerana pangkalan kod asal adalah tertumpu pada bahagian hadapan. Menambahkan pengesahan GitHub dan kefungsian bahagian belakang yang berkaitan bermakna menerokai struktur sedia ada dan melaksanakan penyelesaian bahagian pelayan.

Menghijrahkan Projek dan Menyediakan Bahagian Belakang

Untuk menyokong ciri baharu, saya mula-mula menyusun semula projek itu. Saya mengalihkan semua kod bahagian hadapan sedia ada ke dalam folder awam dan mencipta folder bahagian belakang untuk menempatkan pelaksanaan bahagian pelayan. Untuk bahagian belakang, saya memilih rangka kerja Express kerana ia terintegrasi dengan baik dengan Passport.js, perpustakaan yang saya gunakan untuk mengendalikan pengesahan GitHub.

Langkah-langkah termasuk:

• Menyediakan Ekspres untuk menyampaikan aplikasi.
• Mengkonfigurasi Passport.js untuk mengendalikan pengesahan menggunakan CLIENT_ID dan CLIENT_SECRET, yang saya simpan dalam fail .env untuk keselamatan.
• Menambah laluan untuk mengurus tindakan pengguna seperti membintangi dan menyahbintangkan repositori.

Penyepaduan API GitHub

Selepas menyediakan bahagian belakang, saya menyepadukan API GitHub untuk menyokong fungsi yang diperlukan. Ini termasuk:

• Membolehkan pengguna log masuk melalui akaun GitHub mereka.
• Menambahkan keupayaan untuk membintangi dan menyahbintangkan repositori terus daripada aplikasi.
• Mengambil senarai repositori berbintang pengguna dan memaparkannya pada halaman khusus, boleh diakses melalui butang pada UI.

Menulis Modular, Kod KERING

Selain melaksanakan fungsi, saya menumpukan pada meningkatkan kualiti kod dengan menggunakan prinsip DRY (Don’t Repeat Yourself). Saya memodulasi kod dengan mengasingkan fungsi kepada komponen boleh guna semula, menjadikannya lebih mudah untuk diselenggara dan dilanjutkan pada masa hadapan.

Pengajaran dan Pandangan Ke Hadapan

Ini adalah pengalaman pertama saya bekerja dengan pengesahan GitHub, dan ia memberikan cerapan berharga untuk menyepadukan API pihak ketiga dan mengurus perkhidmatan hujung belakang. Walaupun projek pada mulanya kelihatan mudah, kerja pada bahagian hadapan dan belakang memberi saya pemahaman yang lebih mendalam tentang pembangunan tindanan penuh.

GitExplorer masih mempunyai banyak isu menarik yang dibuka untuk kerjasama. Jika masa mengizinkan, saya bercadang untuk menyumbang lagi. Projek ini telah terbukti mesra pemula sambil menawarkan banyak peluang untuk mempelajari teknologi dan konsep baharu.

Terima kasih kerana membaca, dan saya harap siaran ini memberi inspirasi kepada anda untuk meneroka peluang yang sama untuk pembelajaran dan pertumbuhan.

Atas ialah kandungan terperinci Bekerja dengan GitHub OAuth Authentication. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!