Big-Frontend
- Nehmen Sie
Todo-App als Beispiel, um verschiedene Frameworks und Bibliotheken an der Vorder- und Rückseite zu erleben. - Die Serveradresse lautet
http://localhost:8080 - Die Schnittstellen der vorderen und hinteren Enden sind:
- Holen Sie sich alle Todos:
{path: '/api/todo', method: 'GET', status: 200, return: [{action: 'todo1', done: false}] - Neue Todo hinzufügen:
{path: '/api/todo', method: 'POST', status: 201, return: ''} - Vervollständigen oder schließen Sie das angegebene Todo:
{path: '/api/todo/toggle/{index}', method: 'POST', status: 200, return: ''} - Löschen Sie das angegebene Todo:
{path: '/api/todo/{index}', method: 'DELETE', status: 200, return: ''}
Abgeschlossenes Backend
-
{tech: 'spring-boot', tag: 'springboot-backend'}
Abgeschlossenes Web -Frontend
-
{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'}
Fertiger Befehlszeile Frontend
-
{tech: ['react', 'ink'], tag: 'use-ink-cli'}
Ein Front-End, das unabhängig laufen kann
-
{tech: 'jquery', tag: 'use-jquery-in-static-web' } -
{tech: 'javascript', tag: 'use-pure-javascript' }
Zweck
- Verstehen Sie die Bedeutung von Front-End und Back-End
- Verstehen Sie die Unterschiede und Verbindungen mehrerer Frontends
- Verstehen Sie die Bedeutung eines großen Frontends
- Erleben Sie den technischen Mainstream-Rahmen des Front-Ends
Front-End, Back-End
- Front-End: Entwerfen und implementieren Sie die Schnittstelle über die Interaktion zwischen Mensch und Computer im System
- Befehlszeile: Konsolenprogramm. Es wird normalerweise mit Sprachen wie C, C#und Java implementiert. Eingabe und Ausgabe mit Befehlen und Parametern sowie Scanf und Printf
- Desktop: Verwenden Sie verschiedene grafische Steuerelemente wie Fenster, Menüs, Formulare usw., um Eingabe und Ausgabe mit verschiedenen Geräten wie Tastaturen und Mäusen auszufüllen. Zu den häufig verwendeten Technologien gehören MFC, Java Swing, QT, WPF usw.
- Web (H5): Ähnlich wie Desktop, läuft aber in einem Browser. Zu den Technologien gehören hauptsächlich HTML5, CSS3 und JavaScript
- Mobile: Zu den Mobiltelefonen als Carriers gehören häufig mobile Geräte Android und iOS
- Mini -Programm: Es ist nicht erforderlich, zu installieren oder bereitzustellen, sondern in Anwendungen wie WeChat und im Land sehr beliebt. Wie WeChat-Miniprogramme, QQ-Mini-Programme, Baidu-Mini-Programme, Alipay-Mini-Programme, schnelle Anwendungen ...
- Backend: Auch als Serverseite bezeichnet. Im Allgemeinen zur Bereitstellung von Daten und Diensten.
- Häufige Verarbeitungsverfahren
- Daten werden in der Datenbank gespeichert
- Der Server empfängt Anfragen vom Frontend, bei denen es sich im Allgemeinen um HTTP -Anforderungen handelt.
- Nach der Anfrage wird die relevante Geschäftslogik aufgerufen und das Berechnungsergebnis zurückgegeben
- Nach dem Berechnungsergebnis wird die Antwort zurückgegeben, was im Allgemeinen eine HTTP -Antwort ist. Die Antwort kann mehrere Darstellungen wie JSON, HTML usw. haben.
- Häufig verwendete Technologien und Frameworks
- Java ee, ASP.NET, PHP
- Frühling, Winterschlaf
- ...
- Entwicklungsmerkmale traditioneller Anwendungen
- Der im Front-End and Back-End verwendete Technologiestapel ist nicht einheitlich
- Die von mehreren Frontends verwendeten Technologiestapel sind nicht einheitlich
- Front-End- und Back-End-Entwicklungsmethoden und -ideen sind nicht konsistent
- Es ist schwierig, Ingenieure zu haben, die gleichzeitig vorne und hinten kompetent sind
Großes Frontend, Vollstapel