分析の背景となるオープン ソース プロジェクト
1. オープンソース プロジェクトを観察する
2. オープンソース プロジェクトのダウンロード
ダウンロードが完了したら、解凍し、Code Cloud を使用して最初にダウンロードします。
1.使用されているテクノロジー ([SpringBoot]、[Vue]、Redis)
2.データベースがあるかどうか3. 環境は一致していますか ([Maven]、[npm、nodejs] ], redis... )に合格したら、実行方法を考えてみましょう!
3. 走ることが第一歩
1. 最初に mysql をインポートします
2. フロントエンド インストールの依存関係、npm install [ここでは時間を短縮するために最初に実行します。通常、フロントエンドはバックエンドに依存するため、バックエンド プロジェクトはすべてインストール前に実行されます]
3 . バックエンド プロジェクト アイデアでプロジェクトを開く [Swagger が見つかった場合、実行する最初のステップは、最初に Swagger-ui ページに入ることです! インターフェイスがあるから！
そして、構成ファイルを見てください！デフォルトのポート、そこにある構成は、独自のプロジェクトと環境アドレスに変更する必要があります! ]
4. バックエンドの redis サービスを開く
5. バックエンドの AppRun が実行され、swagger-ui.html ページに入り、インターフェイス ドキュメントを表示する
6. フロントエンドはバックエンドに依存し、npm run dev実行 [フロントエンドはインストール依存です。テスト実行を開始して、インターフェイスが正常かどうかを確認してください。】
つまり、ページ表示がフロントエンドで、swaggerインターフェースドキュメントが表示するデータインターフェースがバックエンドです
4. フロントセクションとリアセクションの分離プロジェクトの固定ルーチン
1. フロントエンドから分析を開始します。コンソールを開き、インターフェイスをクリックして、通話関係の波を分析してください!
2.前後のポートコールがバラバラ：8013以降：8000、操作方法
- インターフェイス リクエストをカプセル化する [Ajax は一般的にフロントエンドとバックエンドの分離に使用され、現在は vue で axios を使用してリクエストをカプセル化します]
- 構成を見つける
- フロントエンドとバックエンドの分離プロジェクトのポイント: インターフェイスの呼び出し関係を見つける
- SpringBootがお届けします！フロントエンドがインターフェイス データを呼び出します。Vue がページのレンダリングを処理します!
- フロントエンド プロジェクトの固定ルーチン
- フロントエンド リクエストを取得して、バック
エンドの対応するインターフェースを見つけます フロントエンド リクエスト
バックエンドの対応するインターフェース ctrl+shift+f api/users を直接検索します
- Controller-Service-Dao: わかります
- 今すぐ前から後ろまで分析してください！しかし、ビューにレンダリングする方法は? フロントエンドを見る
- Vue 標準ルーチン
<template>
视图层
</template>
<script>
js操作
接口的调用
export default {
双向绑定进行渲染
name: 'test'
}
</script>
<style scoped>
页面的样式
</style>
- 独自のプロジェクトを持っている場合、またはモジュールを学習したい場合は、このモジュールを個別に抽出するだけです! 削除方法
5. 良いオープンソース プロジェクトを見つける方法
ケースとしてコード クラウドを使用します。
- カテゴリを検索 JAVA
- コレクションやオープンソースプロジェクトを見て、みんながいいと思えばいい！
- 貴重に見える
- 自分の理解に基づいてそれを見て、段階的な結果、一歩一歩を確実にするために一歩一歩空に到達することはできません
- Javaの学び方
– 知識源マッドゴッドはJAVAを言った