Rumah >Peranti teknologi >industri IT >Cara menggunakan bendera ciri dalam integrasi berterusan
Takeaways Key
mengapa Ci sangat kuat
Mengintegrasikan kod dalam ketulan yang lebih kecil dan dengan cara yang lebih kerap membolehkan pasukan pembangunan mengambil isu -isu yang lebih cepat, serta mendapatkan ciri -ciri baru kepada pengguna secepat mungkin. CI juga menghilangkan keperluan untuk sebarang siaran besar di mana pasukan jurutera perlu berjaga sehingga jam malam untuk meminimumkan gangguan kepada pengguna mereka.
Bendera ciri menyediakan lapisan keyakinan tambahan apabila melepaskan ciri -ciri baru. Dengan membungkus ciri -ciri baru dalam bendera ciri, pemaju dan pasukan produk dapat dengan cepat mengaktifkan atau melumpuhkan ciri -ciri mereka seperti yang diperlukan. Katakan kita memperkenalkan ciri baru ke dalam pengeluaran tetapi kita dapat melihat dengan segera bahawa ada bug dalam kod baru, kerana sesuatu yang khusus dalam persekitaran pengeluaran yang tidak jelas dalam ujian (mari kita hadapi, itu berlaku kepada semua orang ... lebih daripada sekali).
Sebelum ini, ini bermakna (mungkin) prosedur pengembalian yang panjang dan (pasti) yang menyakitkan dan penjadualan semula pelepasan untuk satu lagi jam yang tidak bermoral pada hari yang lain apabila pepijat telah ditetapkan. Sebaliknya, dengan togol suis, ciri boleh dimatikan untuk semua atau subset pengguna dan kesakitan hilang. Sebaik sahaja pepijat dikenalpasti dan ditetapkan, pelepasan patch boleh digunakan, dan ciri ini boleh dibolehkan semula.
Untuk menunjukkan pengintegrasian bendera ciri dan konfigurasi jauh, kami akan mendasarkan pangkalan awal kami pada tutorial de facto React JS mengenai permainan tic-tac-toe. Ini adalah tutorial yang hebat untuk mempelajari asas -asas React, jadi pastikan anda menyemaknya jika anda belum melakukannya.
Jangan risau jika anda tidak tahu React atau JavaScript dengan baik. Konsep -konsep yang akan kita lakukan adalah mengenai proses dan perkakas, dan bukan mengenai kod.
Daripada mengulangi tutorial dari awal, kita akan bermula pada satu titik di mana kita mendapat permainan Tic-Tac-Toe asas dan berjalan.
Pada ketika ini kami akan menggunakan bendera ciri dan konfigurasi jauh untuk terus mengkonfigurasi, menolak dan menggunakan ciri -ciri baru. Untuk mengambil konsep ini untuk melampau, kami akan terus menolak untuk menguasai; Tiada cawangan lain yang akan digunakan. Kami akan memperkenalkan pepijat (dengan sengaja tentu saja!) Dan tolak pembetulan untuk menguasai, untuk menunjukkan bagaimana menangani senario ini tidak memerlukan rollback penuh atau cawangan tambahan.
Jika anda ingin mengikuti kod penulisan semasa tutorial ini, anda boleh mengikat repositori di sini.
Kaedah yang paling biasa untuk mengotomatisasi integrasi berterusan adalah untuk mempunyai pencetus proses membina apabila anda menolak perubahan ke repositori Git anda. Alat binaan yang berbeza mencapai ini dengan cara yang berbeza.
Kami akan menggunakan Netlify untuk projek kami. Netlify membolehkan anda menyambungkan repositori git dan menggunakan secara automatik membina setiap kali anda menolak ke cawangan.
Untuk menggunakan Netlify, hanya mendaftar untuk akaun percuma dan pilih pilihan 'Tapak Baru dari Git' di bahagian atas kanan papan pemuka. Sebaik sahaja anda telah menyambungkan akaun GitHub anda (atau sebaliknya, jika anda ingin menggunakan BitBucket atau GitLab), anda harus dibentangkan dengan pilihan yang ditunjukkan di bawah.
Dalam langkah seterusnya, konfigurasikan Netlify untuk menjalankan aplikasi seperti berikut.
Netlify kini akan diteruskan dan membina permohonan anda untuk anda. Ia akan mengambil masa beberapa minit, tetapi apabila ia selesai, anda akan melihat sesuatu seperti yang berikut:
Melayari ke URL itu harus menunjukkan permainan tic tac toe anda dalam semua kemuliaannya.
Kami akan menggunakan bendera ciri untuk mengawal pengisytiharan pemenang dalam permainan tic-tac-toe. Untuk membuat dan menguruskan bendera ciri kami, kami akan menggunakan Bullet Train kerana ia kini percuma, tetapi terdapat banyak produk bendera ciri lain. Kami akan membiarkan anda memilih yang anda rasa betul.
Untuk meneruskan dengan kami, teruskan dan buat akaun percuma di Bullet Train. Klik pada butang 'Buat Projek' dan buat projek anda. Kami menamakan tutorial FF kami.
Seterusnya, kita perlu membuat ciri baru untuk mengisytiharkan pemenang. Klik pada butang 'Buat Ciri Pertama Anda' di bahagian bawah skrin seterusnya untuk memaparkan borang berikut dan tambahkan butirannya.
Perhatikan bahawa kami telah menyimpan ciri yang dilumpuhkan untuk bermula dengan.
ambil perhatian mengenai dua coretan kod yang ada di bawah ciri ini, yang akan membantu kami dalam langkah seterusnya.
Pertama, mari kita dapatkan projek ini berjalan dalam persekitaran pembangunan kami. Dari baris arahan, navigasi ke folder projek dan jalankan NPM perintah I untuk memasang kebergantungan yang diperlukan.
Next Run NPM Run Dev dan pergi ke http: // localhost: 8080 dalam penyemak imbas anda. Anda harus melihat permainan tic-tac-toe yang sama yang anda lihat di URL Netlify.
Kami kini akan melaksanakan bendera ciri baru kami ke dalam kod sedia ada. Mari kita mulakan dengan memasang pelanggan Bullet Train untuk JavaScript, dengan membuka baris arahan lain dan menjalankan yang berikut dalam direktori projek:
npm i peluru-klien-klien ---- 🎜>
Buka projek dalam editor pilihan anda dan edit ./web/app.js.
Cari fungsi CalculateWinner (Squares). Fungsi ini menentukan sama ada terdapat pemenang atau tidak, berdasarkan sama ada ia dapat mencari garis bentuk yang sama atau tidak. Kami akan mempunyai fungsi ini kembali null berdasarkan nilai bendera ciri kami supaya kami dapat menguji mengisi papan tanpa mengisytiharkan pemenang.
di bahagian paling atas app.js, tambahkan baris berikut:
<span>var declareWinner = true; </span>
Sekarang, mari kita mulakan klien kereta api peluru kami yang kami pasang lebih awal. Salin semua CODE Contoh 2 dari halaman Ciri -ciri di antara muka kereta api peluru dan tampal di bawah garis yang anda tambah.
ID Alam Sekitar dalam coretan kod anda akan menjadi ID persekitaran yang betul yang berkaitan dengan persekitaran pembangunan dalam projek kereta api peluru anda. Anda boleh menyemak ini dengan melayari ke halaman 'Tetapan Alam Sekitar' jika anda mahu.
sekarang kita perlu mengedit fungsi onChange () dalam fungsi BulletTrain.Init () dalam kod yang kami baru disisipkan untuk memenuhi keperluan kami. Gantikan semua kod di sana dengan satu baris:
<span>var declareWinner = true; </span>
Anda kini harus mempunyai ini di bahagian atas app.js anda
declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span>
tatal ke bawah ke fungsi CalculateWinner (Squares) dan di bahagian atas, tepat di atas pengisytiharan garis tetap, mari tambahkan garis:
<span>var declareWinner = true; </span>import bulletTrain from "bullet-train-client"; //Add this line if you're using bulletTrain via npm bulletTrain.init({ environmentID:"", onChange: (oldFlags,params)=>{ //Occurs whenever flags are changed declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span> } });
Dan itu sahaja! Bendera ciri kami kini akan menentukan sama ada pemenang dikira atau tidak pada setiap permainan. Segarkan penyemak imbas anda dan mainkan permainan ini. Anda tidak boleh lagi menang dan sebaliknya seluruh papan kini boleh diisi dengan XS dan OS.
kembali ke pentadbir kereta api peluru dan togol ciri menggunakan suis di sebelah kanan.
menyegarkan penyemak imbas anda dan permainan menjadi kemenangan lagi. Lihat kod untuk akhir bahagian ini di sini.
komit dan tolak kod anda (ya, semua tuan) dan Netlify akan menggunakan kod anda secara automatik. Semak imbas URL Netlify anda sekali lagi dan togol bendera ciri untuk melihatnya berfungsi dalam persekitaran pengeluaran. Manis!
Kami kini akan sengaja memperkenalkan bug ke dalam permainan tic-tac-toe dan menunjukkan bagaimana bendera ciri boleh digunakan untuk menggugurkan ciri yang menyebabkan masalah.
Ciri yang akan kami tambahkan adalah pemilihan siapa yang pertama kali pada permulaan permainan. Untuk itu kami akan menambah beberapa butang yang hanya muncul pada permulaan permainan dan mencegah klik pada papan daripada menambah bentuk.
Pertama, mari kita sediakan bendera ciri kami untuk membungkus ciri baru. Dalam projek Bullet Train anda, buat ciri baru yang dipanggil Select-Who-Goes-First seperti berikut. Mari biarkan ia dilumpuhkan untuk bermula dengan.
Sekarang, mari tambahkan ciri baru kami. Dalam fungsi render () kita akan menjadikan butang, bukannya status, jika permainan belum dimulakan lagi. Di bahagian atas kembalinya fungsi render (), ganti garis:
<span>if (!declareWinner) return null; </span>
... dengan kod berikut:
<span><div className="status">{status}</div> </span>
Sekarang kami ingin menulis kod untuk mengawal ciri baru kami dengan bendera ciri yang kami buat. Seperti dahulu, ini perlu masuk dalam fungsi Bullettrain.init ({...}).
Pertama, mari tambahkan fungsi kitaran hayat ComponentDidMount () ke komponen papan dan kemudian gerakkan keseluruhan peluru. Diperolehi:
<span>var declareWinner = true; </span>
Jika kita meninggalkan peluru.
Sekarang mari tambah kod untuk mengawal ciri baru kami. Kami mahu permohonan itu berkelakuan seperti yang dilakukan sebelum kami menambah ciri ini jika bendera dilumpuhkan. Untuk melakukan itu, mari kita tetapkan nilai keadaan untuk dipilih untuk benar jika bendera dilumpuhkan. Tambah baris berikut dalam kaedah Bullettrain.init ({...}) tepat di bawah garis DeclareWinner.
declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span>mari kita teruskan dan tolak itu (sekali lagi, terus ke tuan). Sebaik sahaja ia dibina, pergi ke URL Netlify anda. Anda harus melihat bahawa tiada apa yang berubah - ini kerana ciri ini masih dilumpuhkan dalam projek kereta api peluru kami.
Kepala ke Bullet Train dan aktifkan ciri tersebut.
cemerlang! Sekarang kita dapat melihatnya berfungsi, tetapi oh, ada pepijat! Ia mungkin untuk memulakan permainan tanpa memilih siapa yang pertama. Jika anda bermain permainan seperti ini, anda dapat melihat bahawa status tidak pernah ditetapkan untuk menunjukkan pemenang. Itu tidak betul!
kembali ke kereta api peluru dan melumpuhkan ciri sehingga kita dapat menyelesaikan apa yang salah. Di sinilah ciri tambahan Bullet Train, seperti persekitaran dan pengguna, berguna. Kami tidak akan masuk ke salah satu daripada ini dalam tutorial ini, tetapi periksa dokumen untuk lebih lanjut mengenai menggunakan pelbagai persekitaran atau mengawal ciri-ciri secara per-pengguna.
Kembali ke pepijat kami: Terdapat satu lagi baris yang kami perlukan untuk menambah ke atas Handleclick () untuk menghalang pemain dari bermula sehingga pemain pertama telah dipilih. Tambah yang berikut di bahagian atas fungsi handleclick ().
<span>var declareWinner = true; </span>import bulletTrain from "bullet-train-client"; //Add this line if you're using bulletTrain via npm bulletTrain.init({ environmentID:"Hidupkan semula ciri ini lagi di Bullet Train dan menguji bahawa dalam persekitaran tempatan anda dan anda harus melihat bahawa kami kini menghalang permainan bermula tanpa memilih siapa yang pertama kali. Hebat! Melakukan itu ke Guru sekali lagi dan menolaknya terus untuk digunakan.", onChange: (oldFlags,params)=>{ //Occurs whenever flags are changed declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span> } });
pergi ke URL Netlify anda dan anda harus melihat ciri baru yang tetap dan berfungsi dengan baik.
anda dapat melihat kod akhir di akhir bahagian ini di sini.
Remote Config
Dalam tutorial kami, kami akan menggunakan ini untuk menukar bentuk yang digunakan oleh setiap pemain dalam permainan kami. Mari buat dua nilai konfigurasi jauh untuk bentuk yang digunakan di papan. Dalam projek kereta api peluru anda, klik pada butang 'Buat Ciri' tetapi kali ini, pilih tab 'Remote Config' dan bukannya 'Bendera Ciri'. Isi data seperti yang di bawah.
semua selesai! Sekarang kembali ke kod. Dalam fungsi OnChange () pelanggan kereta api peluru kami, kami perlu mengambil nilai -nilai ini dan menetapkannya ke keadaan komponen. Mari kita ubah ini.setState () Panggil ke:
<span>var declareWinner = true; </span>
Kami kini mempunyai dua bentuk dan boleh menggantikan semua kegunaan statik di seluruh app.js 'x' dan 'o' dengan nilai negeri sebaliknya. Harus ada 3 contoh setiap: 1 setiap bentuk dalam handleclick () dan 2 setiap bentuk dalam render () (satu adalah dalam panggilan untuk kembali). Inilah kod yang dikemas kini untuk rujukan dalam handleclick ():
declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span>
Perhatikan bahawa untuk keadaan dalam panggilan balik dalam render (), anda perlu membungkus JavaScript dalam pendakap keriting seperti ini:
<span>var declareWinner = true; </span>import bulletTrain from "bullet-train-client"; //Add this line if you're using bulletTrain via npm bulletTrain.init({ environmentID:"", onChange: (oldFlags,params)=>{ //Occurs whenever flags are changed declareWinner <span>= bulletTrain.hasFeature("declare-winner"); </span> } });
melakukan ini ke dalam tuan dan menolak ke repositori git anda untuk melihat perubahan pada URL Netlify anda. Jika anda telah melakukannya dengan betul, permainan harus bermain seperti dahulu dengan bentuk 'X' dan 'O'. Teruskan dan ubah bentuk dalam pentadbir ke huruf yang berlainan dan muat semula halaman. Sekiranya semuanya baik, anda sekarang akan bermain dengan bentuk yang berbeza.
Terdapat banyak lagi yang boleh anda capai dengan konfigurasi jauh, seperti mengawal gaya keseluruhan permainan atau mengatakan dimensi lembaga. Kami menambah lebih banyak nilai konfigurasi jauh termasuk warna bentuk dan saiz persegi. Anda dapat melihat kod siap untuk permainan di sini.
tidak boleh dianggap sebagai peluru emas, bagaimanapun, dan mereka datang dengan kaveat tertentu.
Sebagai contoh, jika anda menggunakan rangka kerja yang mengendalikan skema pangkalan data untuk anda, seperti Django atau Rails, anda perlu berhati -hati apabila melaksanakan bendera ciri dalam model anda. Menggunakan bendera ciri dalam model anda boleh mengakibatkan ketidakcocokan skema DB, yang mungkin membawa bahagian aplikasi anda ke bawah.Begitu juga, jika anda berinteraksi dengan API pihak ketiga yang mempunyai keperluan tertentu untuk penggunanya, menggunakan bendera ciri untuk mengawal aspek ini boleh menyebabkan kesilapan yang tidak dijangka dalam permohonan anda. Juga, sebaliknya, jika aplikasi anda menyediakan API untuk orang lain untuk mengambil, menggunakan bendera ciri untuk mengawal model data API tidak dinasihatkan kerana ia boleh menyebabkan masalah di bawah garis bagi pengguna tersebut.
Akhirnya, kami menggunakan Bullet Train dalam tutorial di atas kerana ia bebas untuk digunakan pada masa ini dan juga sumber terbuka. Terdapat beberapa produk lain di luar sana yang melakukan perkara yang sama atau dengan varian yang sedikit berbeza - anda harus menyemak semua ini untuk menentukan yang terbaik untuk anda. Sebagai contoh, melancarkan HQ Darkly dan Airship.
Apakah potensi risiko menggunakan bendera ciri dan bagaimana saya dapat mengurangkannya? Banyak faedah, mereka juga datang dengan potensi risiko. Salah satu risiko utama ialah kerumitan kod. Mempunyai banyak bendera ciri boleh membuat kod lebih sukar untuk difahami dan dikekalkan. Ini boleh dikurangkan dengan mengekalkan bilangan bendera ciri aktif minimum dan mengeluarkannya sebaik sahaja mereka tidak lagi diperlukan. Satu lagi risiko ialah kesilapan konfigurasi. Ini dapat dikurangkan dengan menggunakan ujian dan pemantauan automatik untuk memastikan bendera ciri berfungsi seperti yang diharapkan. Aplikasi berskala besar boleh mencabar. Satu pendekatan adalah menggunakan sistem pengurusan bendera ciri. Sistem ini menyediakan tempat utama untuk menentukan dan menguruskan bendera ciri, dan sering datang dengan ciri -ciri seperti segmentasi pengguna, ujian A/B, dan analisis. Pendekatan lain ialah menggunakan bendera ciri sebagai pembekal perkhidmatan. Penyedia ini menawarkan penyelesaian yang dihoskan untuk pengurusan bendera ciri, yang boleh menjadi sangat berguna untuk aplikasi berskala besar.
Ya, bendera ciri boleh digunakan dalam seni bina microservices. Mereka boleh menjadi sangat berguna untuk menyelaraskan pelepasan ciri -ciri yang merangkumi pelbagai perkhidmatan. Walau bagaimanapun, penjagaan mesti diambil untuk memastikan bendera ciri secara konsisten digunakan di semua perkhidmatan. atau versi dikeluarkan kepada subset kecil pengguna sebelum dilancarkan kepada semua orang. Bendera ciri boleh digunakan untuk mengawal siapa yang mempunyai akses kepada ciri atau versi baru. Ini membolehkan anda memantau kesan perubahan dan dengan cepat melumpuhkannya jika masalah dikesan. melancarkan. Pelancaran Gelap adalah amalan di mana ciri -ciri baru dikeluarkan kepada subset pengguna sebelum ia dibuat secara terbuka. Ini membolehkan anda menguji ciri dalam persekitaran pengeluaran dan mengumpulkan maklum balas sebelum pelancaran rasmi.
Atas ialah kandungan terperinci Cara menggunakan bendera ciri dalam integrasi berterusan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!