cari

Rumah >hujung hadapan web >tutorial js >Panduan yang tidak masuk akal untuk bahagian hadapan untuk pembangun bahagian belakang

Panduan yang tidak masuk akal untuk bahagian hadapan untuk pembangun bahagian belakang

Patricia Arquette
Patricia Arquetteasal
2025-01-03 11:42:40394semak imbas
  • Pengenalan
  • Asas mutlak
  • Pihak pelanggan berbanding bahagian pelayan
  • Komponen
  • Perpustakaan hadapan
  • Kesimpulan

pengenalan

Saya seorang pembangun bahagian belakang... jenis biasa... jenis yang pandai matematik tetapi dahsyat dalam estetika. Sebarang percubaan pada reka bentuk yang pernah saya buat selalu menghasilkan sampah generik yang kelihatan membosankan. Saya cuba menggunakan berpuluh-puluh alat tetapi hasil akhirnya akan sentiasa kelihatan seperti ditulis dalam Microsoft FrontPage 2003

Saya cukup sedar diri untuk melihatnya, jadi saya berhenti mencuba. Saya akan menulis dokumen kepada anda, tetapi hanya jika anda memberi saya fail gaya $LaTeX$ sedia. Saya akan menulis blog, tetapi hanya dalam Markdown dan biarkan orang lain bimbang tentang daya tarikan visual. Saya akan menyediakan persembahan DevFest, tetapi hanya jika penganjur menyediakan templat PowerPoint. Saya tidak akan cuba mereka bentuk apa-apa, sama ada butang atau borang log masuk.

Namun, saya tidak boleh hanya mencukur kepala saya dan berundur ke belakang perlindungan JSON API --- Saya masih perlu menulis bahagian hadapan untuk projek haiwan kesayangan saya dan membina papan pemuka untuk kegunaan dalaman. Tetapi mencuba untuk memasuki dunia bahagian hadapan adalah amat menyakitkan --- berpuluh-puluh rangka kerja, perpustakaan, falsafah. Saya telah mendengar perkataan React atau Angular atau Node selama 8 tahun yang lalu tetapi saya terlalu takut untuk benar-benar mencuba dan memahaminya. Pembelajaran C atau Leetcode lebih mudah daripada ini.

Walau bagaimanapun, saya memaksa diri saya untuk mempelajarinya, dan kini saya mahu menjadi Prometheus (saya tidak pasti sama ada belum ada rangka kerja JS dengan nama ini) dan membawa pengetahuan ini kepada orang saya --- bahagian belakang devs.

Sebagai bonus, saya menyertakan pengesyoran muktamad rangka kerja bahagian hadapan untuk dipilih. Saya sendiri mengalami lumpuh keputusan untuk masa yang sangat lama dan ini akan membantu anda mengatasinya dan mula membina sesuatu tanpa terlalu memikirkannya.

Asas mutlak

Mari kita mulakan dengan asas mutlak untuk memastikan kita berada di halaman yang sama sebelum membincangkan rangka kerja. Anda boleh melangkau bahagian ini jika anda mahu.

Halaman web yang minimum

Halaman web minimum terdiri daripada fail teks dengan sambungan .html dan teg untuk kandungan:

<html>
    <div>Hello World!</div>
</html>

Untuk menambah pemformatan anda boleh sama ada menambah atribut gaya:

<html>
    <div>



<p>or if you have a lot of formatting, add id to your content and refer to it from <style> tag. The style is formatted using CSS language which looks like an HTML element followed by JSON related to it:<br>


<pre class="brush:php;toolbar:false"><html>
    <div>



<p>This will create static pages that do not change and do not react to any events. To add some interactivity, like checking if you left a form field empty or entered a valid email, you will need JavaScript.</p>

<h3>
  
  
  Running JavaScript
</h3>

<p>Before using any programming language you must first install it on your computer. For C/C++ you need to install a compiler like GCC or Clang, for Python you need to install a CPython interpreter.</p>

<p>To run JavaScript you only need a web browser --- all modern web browsers can run JS code. It is as simple as opening a web browser and going to pressing F12. This will open a JS console:</p>

<p><img src="https://img.php.cn/upload/article/000/000/000/173587576253989.jpg" alt="A no-nonsense guide to frontend for backend developers" /></p>

<p>You can also create a text file with extension .html  and put a <script> tag on it, open this file in browser, and the outcome will be displayed if you press F12:<br>


<pre class="brush:php;toolbar:false"><!-- myfile.html -->
<html>
    <script>
        // write a JS code here
        console.log('Hello World');
    </script>
</html>

Walau bagaimanapun, atas sebab keselamatan, konsol penyemak imbas tidak mempunyai akses kepada sistem fail anda dan tidak mempunyai beberapa ciri lain yang membolehkan anda menggunakan JS untuk, sekurang-kurangnya, mencapai kefungsian bahasa skrip lain seperti Python atau Ruby. Jadi, terdapat cara kedua untuk menjalankan kod JS pada komputer anda --- memasang Node.js. Ia pada asasnya adalah penterjemah JS yang boleh melakukan perkara seperti membaca dan menulis fail:

//$ node
//Welcome to Node.js v23.3.0.
//Type ".help" for more information.
> console.log('Creating a new directory');
> fs.mkdirSync('new_dir'); // access filesystem using fs

Dengan Node.js anda boleh menjalankan kod JS dalam pelayan atau dalam bekas Docker anda tanpa perlu memasang pelayar web. Kita akan lihat di bawah bahawa ini sangat berguna.

Timbunan klasik

Menggabungkan bahagian di atas, kita boleh membuat halaman web menggunakan persediaan HTML CSS JS klasik.

Ia boleh digabungkan dalam satu fail .html dengan 3 bahagian: kandungan itu sendiri, gaya dan skrip:

<html>
    <div>Hello World!</div>
</html>

skrip.js

<html>
    <div>



<p>or if you have a lot of formatting, add id to your content and refer to it from <style> tag. The style is formatted using CSS language which looks like an HTML element followed by JSON related to it:<br>


<pre class="brush:php;toolbar:false"><html>
    <div>



<p>This will create static pages that do not change and do not react to any events. To add some interactivity, like checking if you left a form field empty or entered a valid email, you will need JavaScript.</p>

<h3>
  
  
  Running JavaScript
</h3>

<p>Before using any programming language you must first install it on your computer. For C/C++ you need to install a compiler like GCC or Clang, for Python you need to install a CPython interpreter.</p>

<p>To run JavaScript you only need a web browser --- all modern web browsers can run JS code. It is as simple as opening a web browser and going to pressing F12. This will open a JS console:</p>

<p><img src="https://img.php.cn/upload/article/000/000/000/173587576253989.jpg" alt="A no-nonsense guide to frontend for backend developers" /></p>

<p>You can also create a text file with extension .html  and put a <script> tag on it, open this file in browser, and the outcome will be displayed if you press F12:<br>


<pre class="brush:php;toolbar:false"><!-- myfile.html -->
<html>
    <script>
        // write a JS code here
        console.log('Hello World');
    </script>
</html>

Masalah terbesar dengan persediaan ini ialah jika anda melihat elemen HTML, contohnya, , anda tidak boleh tahu gaya mana yang ada dan skrip mana yang mendengarnya melainkan anda melihat pada dua fail yang lain . Begitu juga, jika anda melihat fail .js, anda melihat fungsi sayHelloWorld() tetapi tidak tahu sama ada ia diperlukan atau tidak, atau jika sesetengah elemen memanggilnya atau tidak, tanpa melihat fail .html. Ini bertentangan dengan prinsip Lokal Tingkah Laku.

Apa pun, persediaan ini telah digunakan di Web selama beberapa dekad.

Sebelah pelanggan vs. sebelah pelayan

Hebat! Kami telah membincangkan perkara asas. Sekarang mari kita bincangkan tentang dilema utama yang mendasari semua perbincangan mengenai pilihan rangka kerja bahagian hadapan dan seni bina apl anda secara umum. Sebelum kita mulakan, mari kita jelaskan beberapa istilah: sebelah pelanggan bermaksud penyemak imbas atau apl yang digunakan oleh pengguna kandungan anda dan sebelah pelayan biasanya merupakan pelayan bahagian belakang yang menyimpan maklumat log masuk, mempunyai akses kepada pangkalan data, dan secara keseluruhan berfungsi sebagai tulang belakang keseluruhan apl. Kini kami bersedia untuk menyelam lebih dalam.

Penjanaan HTML klasik

Dalam mana-mana apl web bukan remeh yang memaparkan apa-apa jenis data, kami memerlukan cara untuk menjana skrip HTML secara automatik. Jika tidak, apabila data dikemas kini, seseorang perlu mengemas kini teg HTML secara manual.

Memandangkan HTML ialah fail teks ringkas, ia boleh dibuat dengan mudah oleh mana-mana bahasa skrip sebagai rentetan. Terdapat banyak perpustakaan yang melakukan ini. Sebagai contoh, dengan perpustakaan Jinja2 kita boleh menulis semua elemen senarai mylist = [1,2,3,4,5] ke dalam baris jadual menggunakan bahasa yang menyerupai Python:

//$ node
//Welcome to Node.js v23.3.0.
//Type ".help" for more information.
> console.log('Creating a new directory');
> fs.mkdirSync('new_dir'); // access filesystem using fs

Sudah tentu, penyemak imbas tidak akan memahami ini --- anda perlu memberikan skrip Jinja2 ini ke dalam HTML sebenar dengan menjalankan arahan khas dalam Python, yang akan menghasilkan fail .html:

<html>
    <!-- page HTML content here -->
    <div>



<p>You can see that we have a button that triggers a function sayHelloWorld(), which is defined inside  <script> tags and it has font size of 40pt, which is defined inside <style> tags.</p>

<p>Also note that the comment symbols are different in all 3 sections:</p>
  • inside pure HTML it is
  • inside CSS it is /* */
  • inside JS it is //.

This shows that the browser understands that these are 3 different languages. So, the usual practice is not to clutter .html file too much and separate it into 3 files and call styles and scripts by file path:

content.html

<html>
    <div>



<p><strong>styles.css</strong><br>
</p>

<pre class="brush:php;toolbar:false">#mytext {color:red; font-size:20pt}
button {font-size: 40pt}

Ciri ini sangat penting sehinggakan ia mempunyai nama istimewa --- templatan. Saya ingin menekankan satu perkara: penjanaan HTML sedemikian daripada templat berlaku dalam pelayan dalam bahasa pilihan anda (Python/Ruby/Java/C#), biasanya bahasa yang ditulis kod hujung belakang anda. Pelayar tidak memahami bahasa ini secara asli --- mereka hanya memahami JS, jadi kami menghantar fail HTML yang telah diberikan kepada mereka. Ini akan menjadi penting di kemudian hari.

API JSON lwn HTML

Dalam bahagian sebelumnya kita melihat bagaimana bahagian belakang boleh menjana skrip HTML dan mengisinya dengan data daripada pangkalan data dan maklumat lain. Contohnya, jika pengguna menekan butang Suka pada beberapa siaran media sosial, bahagian belakang mesti mengemas kini kandungan halaman Siaran Suka untuk memasukkan siaran baharu itu di sana. Ini boleh dilakukan dengan dua cara:

1) Backend mempunyai templat HTML sedia dengan beberapa skrip Jinja2 dan menjadikannya dengan hasil pertanyaan terkini daripada pangkalan data:

<html>
    <div>Hello World!</div>
</html>

Di sini HTML yang diberikan dihantar terus ke bahagian hadapan bersama-sama dengan gaya CSS dan skrip JS. Penyemak imbas hanya memaparkan perkara yang telah disediakan oleh bahagian belakang dan tidak mengetahui jenis data atau sebarang logik pada halaman.

2) Backend menghantar JSON yang menentukan hasil pertanyaan daripada jadual liked_posts pangkalan data dalam format yang akan difahami oleh penyemak imbas:

<html>
    <div>



<p>or if you have a lot of formatting, add id to your content and refer to it from <style> tag. The style is formatted using CSS language which looks like an HTML element followed by JSON related to it:<br>


<pre class="brush:php;toolbar:false"><html>
    <div>



<p>This will create static pages that do not change and do not react to any events. To add some interactivity, like checking if you left a form field empty or entered a valid email, you will need JavaScript.</p>

<h3>
  
  
  Running JavaScript
</h3>

<p>Before using any programming language you must first install it on your computer. For C/C++ you need to install a compiler like GCC or Clang, for Python you need to install a CPython interpreter.</p>

<p>To run JavaScript you only need a web browser --- all modern web browsers can run JS code. It is as simple as opening a web browser and going to pressing F12. This will open a JS console:</p>

<p><img src="https://img.php.cn/upload/article/000/000/000/173587576253989.jpg" alt="A no-nonsense guide to frontend for backend developers" /></p>

<p>You can also create a text file with extension .html  and put a <script> tag on it, open this file in browser, and the outcome will be displayed if you press F12:<br>


<pre class="brush:php;toolbar:false"><!-- myfile.html -->
<html>
    <script>
        // write a JS code here
        console.log('Hello World');
    </script>
</html>

Pelayar menjalankan fungsi JS khas yang meminta JSON sedemikian, dan apabila mereka menerimanya, mereka menggunakan data ekstrak daripadanya dan menjana HTML daripadanya pada penyemak imbas itu sendiri:

//$ node
//Welcome to Node.js v23.3.0.
//Type ".help" for more information.
> console.log('Creating a new directory');
> fs.mkdirSync('new_dir'); // access filesystem using fs

Pilihan 2 popular atas sebab tertentu, walaupun ia lebih rumit. Dalam persediaan ini, anda hanya mendedahkan port bahagian hadapan kepada pelanggan, dan ia akan menyediakan apl JS HTML statik tanpa memerlukan bahagian belakang. Dan hanya apabila ia perlu mengambil data dari bahagian belakang, bahagian hadapan akan menyambung ke bahagian belakang itu sendiri, mengasingkan fungsi ini daripada penyemak imbas. Sudah tentu, untuk berbuat demikian, bahagian hadapan sekarang memerlukan penghalanya sendiri. Pada asasnya, ini adalah bahagian hadapan yang cuba melakukan perkara yang sepatutnya dilakukan oleh bahagian belakang.

Komponen

Setakat ini, kami telah membincangkan asas tentang cara kod bahagian hadapan yang berfungsi boleh ditulis dan di mana ia terletak. Kami telah melihat bagaimana HTML boleh dijana secara automatik tetapi, sehingga kini, kami mengandaikan bahawa bahagian JS ditulis secara manual. Ini selalunya tidak berlaku dalam pembangunan frontend kehidupan sebenar. Menulis skrip JS secara manual adalah menyusahkan dan struktur kod anda menjadi sangat kemas dengan cepat. Selain itu, jika anda perlu menggunakan semula skrip, anda perlu menyalin dan menampalnya. Jadi, sejak awal lagi, pembangun menggunakan beberapa jenis perpustakaan untuk menjadikan pembangunan JS lebih mudah dan lebih tersusun.

JQuery

Pada masa awal, menggunakan vanilla JS untuk mencari dan mengubah suai elemen atau menghantar permintaan AJAX ke pelayan adalah sangat menyusahkan. Oleh itu, banyak pembangun menggunakan JQuery, yang merupakan gula sintaksis yang kemas di atas JS vanila. Banyak alat tambah telah ditulis dalam JQuery, seperti Datatables (jadual interaktif dengan carian, penomboran, pengisihan keluar dari kotak), atau jam animasi, atau pembilang dsb. Menggunakan komponen sedemikian yang dipratulis oleh orang lain adalah sangat mudah --- cuma muat turun kod dan tambahkannya pada halaman HTML anda di bawah tag. Melihat semula contoh dari atas, kita boleh menambah baris pada jadual dengan lebih mudah dengan JQuery:

<html>
    <div>Hello World!</div>
</html>

atau menghantar permintaan AJAX ke API bahagian belakang memerlukan keseluruhan perpustakaan berasingan untuk vanilla JS sementara ia boleh dilakukan dengan mudah dalam JQuery:

<html>
    <div>



<p>or if you have a lot of formatting, add id to your content and refer to it from <style> tag. The style is formatted using CSS language which looks like an HTML element followed by JSON related to it:<br>


<pre class="brush:php;toolbar:false"><html>
    <div>



<p>This will create static pages that do not change and do not react to any events. To add some interactivity, like checking if you left a form field empty or entered a valid email, you will need JavaScript.</p>

<h3>
  
  
  Running JavaScript
</h3>

<p>Before using any programming language you must first install it on your computer. For C/C++ you need to install a compiler like GCC or Clang, for Python you need to install a CPython interpreter.</p>

<p>To run JavaScript you only need a web browser --- all modern web browsers can run JS code. It is as simple as opening a web browser and going to pressing F12. This will open a JS console:</p>

<p><img src="https://img.php.cn/upload/article/000/000/000/173587576253989.jpg" alt="A no-nonsense guide to frontend for backend developers" /></p>

<p>You can also create a text file with extension .html  and put a <script> tag on it, open this file in browser, and the outcome will be displayed if you press F12:<br>


<pre class="brush:php;toolbar:false"><!-- myfile.html -->
<html>
    <script>
        // write a JS code here
        console.log('Hello World');
    </script>
</html>

Walau bagaimanapun, dari masa ke masa, vanila JS dan standard HTML itu sendiri menambah banyak fungsi, menjadikan JQuery agak usang. Contohnya, kalendar pop timbul untuk memilih tarikh terbina dalam HTML pada masa kini. Namun begitu, banyak web semasa bergantung pada JQuery dalam satu cara atau yang lain.

Bootstrap

Sekitar tahun 2010, Bootstrap telah dicipta sebagai perpustakaan komponen boleh guna semula, seperti butang cantik, borang responsif dan tetingkap timbul. Ciri utama Bootstrap ialah ia bergantung pada sintaks HTML, cuba meminimumkan masa dan tenaga yang dibelanjakan oleh pembangun untuk menulis kod JS sebenar. Ia menggunakan JQuery dan CSS di bawah hud, tetapi ia mengabstrakkannya sepenuhnya untuk penggunanya. Pada asasnya, menggunakan Bootstrap semudah menambah kelas pada elemen HTML.

Sebagai contoh, anda ingin menulis butang yang menunjukkan atau menyembunyikan teks apabila ditekan. Dalam JS ini kelihatan seperti:

//$ node
//Welcome to Node.js v23.3.0.
//Type ".help" for more information.
> console.log('Creating a new directory');
> fs.mkdirSync('new_dir'); // access filesystem using fs

Pelayar web tidak akan memahami elemen, jadi langkah terakhir adalah untuk menyusun kod JSX ini ke dalam HTML JS. Hasilnya adalah seperti:

<html>
    <!-- page HTML content here -->
    <div>



<p>You can see that we have a button that triggers a function sayHelloWorld(), which is defined inside  <script> tags and it has font size of 40pt, which is defined inside <style> tags.</p>

<p>Also note that the comment symbols are different in all 3 sections:</p>
  • inside pure HTML it is
  • inside CSS it is /* */
  • inside JS it is //.

This shows that the browser understands that these are 3 different languages. So, the usual practice is not to clutter .html file too much and separate it into 3 files and call styles and scripts by file path:

content.html

<html>
    <div>



<p><strong>styles.css</strong><br>
</p>

<pre class="brush:php;toolbar:false">#mytext {color:red; font-size:20pt}
button {font-size: 40pt}

Walau bagaimanapun, pendekatan ini belum begitu berkesan.

Perpustakaan komponen JS

Bagi mereka yang teragak-agak menggunakan perpustakaan seperti React.js, terdapat perpustakaan JS yang menyediakan komponen pra-disusun seperti Chart.js yang boleh anda gunakan untuk mencipta carta dengan vanila JS:

function sayHelloWorld() {
    console.log('Hello World');
}

yang bukan cara paling intuitif untuk menulis halaman dinamik.

Ia adalah perpustakaan dan menyokong pelbagai alat pihak ke-3 untuk penghalaan dan pengurusan negeri. Itulah sebabnya ia terlalu fleksibel dan kurang intuitif untuk pemula.

Keputusan: Tidak disyorkan.

Vue.js

Ringkasan ringkas:
Menggunakan templat untuk menambah JS ke dalam HTML:

<table>
    {% for item in mylist %}
        <tr> <td> {{ item }} </td> </tr>
    {% endfor %}
</table>

Ia adalah rangka kerja yang minimum. Dan anda akan mendapati diri anda menulis banyak kod JS vanila untuk mencapai beberapa fungsi yang mudah dalam Vue.js

Keputusan: Tidak disyorkan.

Alpine.js

Ringkasan ringkas: perpustakaan minimum yang tidak mempunyai langkah binaan --- keseluruhan pustaka ialah satu fail JS 15 KB.

Menggunakan templat seperti Vue.js dan Svelte tetapi anda boleh menulis JS terus di dalam atribut HTML tanpa sebarang persekitaran:

<html>
    <div>Hello World!</div>
</html>

Ia memasarkan dirinya sebagai pengganti moden untuk JQuery dan ia sangat bagus untuk menambahkan sedikit interaktiviti tanpa antara muka pengguna yang rumit.

Keputusan: Disyorkan jika anda memerlukan sedikit interaktiviti dan pengendalian JSON.

HTMX

Ringkasan ringkas: perpustakaan yang menggalakkan mempunyai semua logik di bahagian belakang dan meminta HTML dan bukannya JSON.

Menggalakkan penggunaan mana-mana perpustakaan templat bahagian belakang seperti Jinja2 untuk menjana HTML yang diperlukan dan kemudian menghantar coretan HTML ini kepada pelanggan tanpa sebarang JS.

<html>
    <div>



<p>or if you have a lot of formatting, add id to your content and refer to it from <style> tag. The style is formatted using CSS language which looks like an HTML element followed by JSON related to it:<br>


<pre class="brush:php;toolbar:false"><html>
    <div>



<p>This will create static pages that do not change and do not react to any events. To add some interactivity, like checking if you left a form field empty or entered a valid email, you will need JavaScript.</p>

<h3>
  
  
  Running JavaScript
</h3>

<p>Before using any programming language you must first install it on your computer. For C/C++ you need to install a compiler like GCC or Clang, for Python you need to install a CPython interpreter.</p>

<p>To run JavaScript you only need a web browser --- all modern web browsers can run JS code. It is as simple as opening a web browser and going to pressing F12. This will open a JS console:</p>

<p><img src="https://img.php.cn/upload/article/000/000/000/173587576253989.jpg" alt="A no-nonsense guide to frontend for backend developers" /></p>

<p>You can also create a text file with extension .html  and put a <script> tag on it, open this file in browser, and the outcome will be displayed if you press F12:<br>


<pre class="brush:php;toolbar:false"><!-- myfile.html -->
<html>
    <script>
        // write a JS code here
        console.log('Hello World');
    </script>
</html>

dan bahagian belakang menghantar bukan JSON tetapi coretan HTML:

//$ node
//Welcome to Node.js v23.3.0.
//Type ".help" for more information.
> console.log('Creating a new directory');
> fs.mkdirSync('new_dir'); // access filesystem using fs

Menyokong semua kata kerja HTTP (GET/POST/PUT/PATCH/DELETE).

Keputusan: Disyorkan jika anda tidak memerlukan data JSON.

Rangka kerja mana yang hendak dipilih?

Saya akan cuba untuk menjadi sesederhana dan mengenepikan yang mungkin, kerana jika saya pergi ke analisis objektif kebaikan dan keburukan, anda tidak akan mendapat sebarang maklumat berguna selain daripada "ia bergantung". Saya akan bersikap berat sebelah terhadap pergerakan paling sedikit yang diperlukan untuk menyediakan antara muka pengguna dan untuk mengelakkan langkah binaan jika boleh. Jadi, inilah cadangan utama saya:

A no-nonsense guide to frontend for backend developers

Kesimpulan

Dalam catatan blog ini saya ingin berkongsi semua yang saya pelajari tentang frontend sebagai pembangun backend. Nampaknya perkara ini terlalu rumit dan menakutkan, walaupun, setelah menggali, saya menyedari bahawa terdapat logik dan struktur padanya. Saya harap saya dapat menyampaikan pemahaman saya kepada anda, dan anda mendapati siaran ini berguna.

Atas ialah kandungan terperinci Panduan yang tidak masuk akal untuk bahagian hadapan untuk pembangun bahagian belakang. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Python Java ruby json jquery css ajax bootstrap less html angular Static String if for while select format include require try catch math using internal Interface Attribute Generic copy delete JS console function this table docker idea leetcode database kind web app http microsoft prometheus powerpoint everything Access router Other
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Lebih Sedikit Fail, Lebih Banyak Baris lwn. Lebih Banyak Fail, Lebih Sedikit Baris KodArtikel seterusnya：Lebih Sedikit Fail, Lebih Banyak Baris lwn. Lebih Banyak Fail, Lebih Sedikit Baris Kod

Artikel berkaitan

Lihat lagi