Big-Frontend
- Ambil
Todo-App sebagai contoh untuk mengalami berbagai kerangka kerja dan perpustakaan di ujung depan dan belakang. - Alamat server adalah
http://localhost:8080 - Antarmuka ujung depan dan belakang adalah:
- Dapatkan semua Todos:
{path: '/api/todo', method: 'GET', status: 200, return: [{action: 'todo1', done: false}] - Tambahkan TODO baru:
{path: '/api/todo', method: 'POST', status: 201, return: ''} - Lengkapi atau tutup TODO yang ditentukan:
{path: '/api/todo/toggle/{index}', method: 'POST', status: 200, return: ''} - Hapus TODO yang ditentukan:
{path: '/api/todo/{index}', method: 'DELETE', status: 200, return: ''}
Backend selesai
-
{tech: 'spring-boot', tag: 'springboot-backend'}
Deptend Web Selesai
-
{tech: 'vuejs', tag: 'use-vue-frontend' } -
{tech: 'vuejs-vuex', tag: 'use-vuex'} -
{tech: 'react', tag: 'use-react'} -
{tech: ['react', 'redux'], tag: 'use-react-redux'} -
{tech: ['react', 'hooks'], tag: 'use-react-hooks'} -
{tech: 'jquery', tag: 'use-jquery-ajax-to-read/write-from/to-server'} -
{tech: ['react', 'typescript'], tag: 'use-react-typescript'} -
{tech: ['react', 'typescript', 'redux'], tag: 'use-react-typescript-redux'}
Depan Line Command Command
-
{tech: ['react', 'ink'], tag: 'use-ink-cli'}
Front-end yang dapat berjalan secara mandiri
-
{tech: 'jquery', tag: 'use-jquery-in-static-web' } -
{tech: 'javascript', tag: 'use-pure-javascript' }
Tujuan
- Memahami arti front-end dan back-end
- Memahami perbedaan dan koneksi beberapa front-end
- Memahami pentingnya front-end besar
- Rasakan kerangka teknis arus utama dari front-end
Front-end, back-end
- Front-end: Merancang dan mengimplementasikan antarmuka tentang interaksi manusia-komputer dalam sistem
- Baris Perintah: Program Konsol. Biasanya diimplementasikan menggunakan bahasa seperti C, C#, dan Java. Input dan output dengan perintah dan parameter, serta scanf dan printf
- Desktop: Gunakan berbagai kontrol grafis seperti windows, menu, formulir, dll. Untuk melengkapi input dan output menggunakan berbagai perangkat seperti keyboard dan tikus. Teknologi yang umum digunakan termasuk MFC, ayunan Java, QT, WPF, dll.
- Web (H5): Mirip dengan desktop, tetapi berjalan di browser. Teknologi yang diadopsi terutama termasuk HTML5, CSS3, dan JavaScript
- Ponsel: Menggunakan ponsel sebagai operator, perangkat seluler umum termasuk Android dan iOS
- Program Mini: Tidak perlu menginstal atau menggunakan, berjalan dalam aplikasi seperti WeChat, dan cukup populer di negara ini. Seperti program mini WeChat, program mini QQ, program mini Baidu, program mini alipay, aplikasi cepat ...
- Backend: Juga dikenal sebagai sisi server. Umumnya digunakan untuk menyediakan data dan layanan.
- Prosedur pemrosesan umum
- Data disimpan dalam database
- Server menerima permintaan dari ujung depan, yang umumnya merupakan permintaan HTTP.
- Menurut permintaan tersebut, logika bisnis yang relevan dipanggil dan hasil perhitungan dikembalikan
- Menurut hasil perhitungan, respons dikembalikan, yang umumnya merupakan respons HTTP. Respons dapat memiliki beberapa representasi, seperti JSON, HTML, dll.
- Teknologi dan kerangka kerja yang umum digunakan
- Java ee, asp.net, php
- Musim semi, hibernasi
- ...
- Karakteristik pengembangan aplikasi tradisional
- Tumpukan teknologi yang digunakan di front-end dan back-end tidak disatukan
- Tumpukan teknologi yang digunakan oleh beberapa front-end tidak disatukan
- Metode dan ide pengembangan front-end dan back-end tidak konsisten
- Sulit untuk memiliki insinyur yang mahir di depan dan belakang berakhir pada saat yang sama
Ujung depan yang besar, tumpukan penuh