17)あ、すみません、フロントです.DBAverでCRUDのAPIを作成します.OpenAPIでも、Firebaseでdbを書くこともできます.😎 (code-camp FE 6機)


今日もバックエンドの先端を知るためのレッスンになりました!
Somenelは私がとても尊敬している、、、何でもできる、声を聞くと、心が晴れるGat Si Yunメンター、、、、
<<<今週はますますフロントのバッグに対する理解が想像以上に重要になってきました!
もちろん、私はいろいろなライブラリと初めて聞いたツール、サーバーを構築した友达、api、、、、情報しか受け取りませんでした.
自ら構築した後host...テーブルを作るのは難しいけど!!バックエンドと連携してプロジェクトを構築する場合、ぼんやりした開発者は、、、、(?)
エラーを発見したり、データ・ストリームを理解したりするには、バックエンドとフロントエンドがお互いの動作原理、コラボレーション方法、ツールを理解する必要があります.だから今週のバックグラウンドにソースをつけてhatingarmi!!!

-こんにちは、リプタン、おはようございます!


今日は普通の難易度の2番目の問題をすることができませんでした...あとで昼食の時間に会いましょう.
// 
1번문제. 길이가 같은 두 1차원 정수 배열 a, b가 매개변수로 주어집니다
. a와 b의 내적을 return 하도록 solution 함수를 완성해주세요.

// 
이때, a와 b의 내적은 a[0]*b[0] + a[1]*b[1] + ... + a[n-1]*b[n-1] 입니다. (n은 a, b의 길이)

function solution(a, b) {
    var answer = 0;
    for(i=0; i<a.length; i++){
        answer += a[i]*b[i]
    }
    return answer;
}


// 두번째문제 못풀음 
// 
2.정수를 저장한 배열, arr 에서 가장 작은 수를 제거한 배열을 리턴하는 함수, 
  solution을 완성해주세요., 리턴하려는 배열이 빈 배열인 경우엔 배열에 -1을 채워 리턴하세요. 
  예를들어 arr이 [4,3,2,1]인 경우는 [4,3,2]를 리턴 하고, [10][-1]을 리턴 합니다.

function solution(arr) {
    var answer = [];
    let result = [];
    if(arr.length ===1 ){
        answer = [-1]
    } else {
        for(i=1; i<arr.length; i++){
          result += arr.sort((a,b)=>{
		return a-b
	})[i]            
        } 
     return result           
    }
}

-フロントエンドおよびバックエンド構造の理解


バックエンドがちょっと怖い...ガワーズ
今日は勉強します!!!明日apiをします.
(つまり、今日はポールの課題を最善を尽くします!)

JavaScript Yes-ブラウザとノードjsで実行できると思ってください!

- Open-API, Public-API


-親切な人がapiを作成し、誰でも無料で使用できます!無料でダウンロードすると、1つ1つがテーマで、下のサイトも多いです
-アピキー登録?必ずあげるもの.
HTTPS-https要求アドレスを使用する必要があるのはyesです.
Cross Origin Resource Sharing(CORS)
-originは元の場所で、crossoriginは他のページにapiを書きたいので、根本的なサイトから情報をまたいでデータをインポートできれば、yes!
ブラウザはnoという名前の子供を止めるので(naverはkakao apiを要求できません)
そのため、noの子供たちはブラウザではなくバックエンド、モバイルアプリケーション、または他の場所から要求します.

-無料アプリに入ろう!


-例としてdogを見たことがあります.上に青いボタンアドレスでapiを要求したら、次のようにデータをあげます.

住所を持って郵便配達員のところへ行ってみよう...!
getを選択したら、インポートしたアドレスを検索します!
住所は?ここをクリックすると写真が見えます!
ああ!住所の形で写真を見せてあげましょう.
これは、ダウンロードファイルのアドレスを知ることで、ブラウザがコンピュータに接続され、ファイルを画面に描画する方法です.
各ファイルには保存されたパソコンがあり、アドレスを発行すれば、アクセスしてダウンロードすることができます.
最初はhtml、css、javascript、2回はimgの写真を受信して描きます!(ネイバーのHPみたいなところに入って見ると写真は後で載せます)
あ同じフォントも!みんなに見せる量を持ってきて
実際に適用するには、vscodeにアドレスを持って行ってaxiosで書くように要求します!
axiosをページに接続するときに実行させましょう.

以前はボタンを押してお願いしていたら.
データをresultに入れて、交換して見せます.

だから私はこのようにみんなに見せたいです.Graphqlはusequeryを使って簡単に見せることができますが、私たちのrest apiはこのような関数を書いてuseeffectを書く必要があります.私たちもreactqueryを使いましょう!
axiosを1、2回使用するだけです.
プロジェクトを行う場合はreactiqueryをダウンロードする必要があります
分からないわ探しに行こう

-バックエンドの理解


-ノードプログラムはバックエンドで24時間実行されます.
(JavaScriptで作成)
-フロントでも同様、ガーゼdevは24時間開いています.
(これで24時間ログインできる!
-browserからフロントに接続して1回描きます.
次に、バックグラウンドで投稿リストの内容や画像を表示できます.
ビデオなどのバックグラウンドapiリクエストにより、バックグラウンドデータベースからデータを取り出し、追加表示する方法
24時間起動プログラム:サーバプログラム!
サーバプログラムを実行するコンピュータ:サーバコンピュータ!

このようなサーバごとにポート番号があります!
1台のコンピュータは3つのプログラムをダウンロードすることができますが、1台のコンピュータは1つしかダウンロードできません.私たちは約束しました.
今私たちは私のパソコンの中で、世界に公开する时(発表する时)フロントエンドサーバーのパソコンをするべきでしょうか?
今、私たちのローカルホスト3000は、私たちのパソコンの中でhtmlを意味しています.持ってきてバッグの中でUsequeryをリクエストして持ってきてみんなに見せて!

-データベース・コンピュータはどのような構造で構成されていますか?
データを様々な形で格納!
大きく二つに分けて、sql(siql)、nosql(no siql)!

こんな感じで保存!
sqlはリレーショナル・データベースです.RDBとも呼ばれます!

Nosql(Nosql)にはMongoDB、Firebase、Redis...
sqlにはOracle、MySQL、Postgresがあります...こんなのありますか.
ブラウザのバックグラウンドからデータを取り出した時!
-データベースを取り出すときに必要な言語が違います!
-データをロードしたすべての言語を暗記して書くべきです.ライブラリがあれば、自動的に作成されます.
オブジェクトを使用して、データをロード、挿入、管理するだけでいいです.

標準フォーマット、typeform、prisma
NocequalODM-Mongoose
-フロントの私たちがします.
1.DB接続(postgress)、内部データの表示
2.自分のDBに接続してみる(私の番号は5012)
3.バックエンドからのデータベース接続
4.バックエンドでソースコードを記述する(チェッカーテーブルを作成するプロセス)
5.APIの作成(コンテンツはcrud標準なので大きい!)

1.DB接続(postgress)、内部データの表示


Dbeaverはデータベース管理プログラムです!
  • データベースのコンピュータで、どのようにどのデータにアクセスするか、私はこのプログラムを通じて入力しました!
  • どのデータベースに接続するかを選択
  • に接続するホストにipアドレスとパスワードを入力して接続する(私のパスワードはpostgres 2021)
  • ああ、サンパウロで使用したapiもリクエストしたapiもここに保存されています!!

  • 型オペレーティングシステムのインストール、JavaScriptソースコードで作成、NodeJで実行?!
  • まず私のポートを入力して、中には1枚のテーブルがなくて、それから上で作成する過程!
  • JavaScriptをnodejsとして実行する場合は、ブラウザで実行する必要はなく、私のコンピュータで実行します.
    -javascriptはブラウザでのみ実行されます.nodeで実行しましょう.だから私のパソコンで動作しているのが見えます.

    -ソースコードをデータベースに関連付ける
    -ブラウザに表示されるhtmlなどがないので、tsファイルにしてバックエンドに接続します.
    -端末のインストールが必要な部分は
    -タイプスクリプト:糸add typescript-dev
    -typeom:交代で運転する必要があるので-dev:th糸add typeormに依存しません
    yarn.lockは、使用する他の多くのライブラリのバージョンを管理します.
    yarn install --production
    もしやるなら、私たちが以前やったのとは違って、導入バージョンに追加しましょう.
    devdependencies. dependencies
       {
     "devDependencies": {
       "typescript": "^4.6.3"
     },
     "dependencies": {
       "typeorm": "^0.3.4"
     }
    }```
  • のように別々に設定されている理由を見てみましょう.
  • タイプのo'mがPostGraceに接続するために手伝うアシスタントはpg.である.
  • クラスフォルダでは、タイプスクリプトを簡単に設定できます.
    next.jsをやったので簡単ですが、ここでは自分でやります.
    typescriptを入力すると.
    tsconfig.jsonについては、後でを見ます
    これに基づいて、ファイルを作成し、推奨コードを貼り付ける
    ではIndexはtsファイル撮影コンソールから
    node index.tsを打つと.
    私のパソコンがよく動いているのが見えます.
    1.インストールしたO'Mをインポート
    2.Type O'Amが指定した方法でデータソースを作成する

    このようにウェブサイトを見て、私の接続する地方によって書きます
    テーブルの作り方も出てきました!
    typeormに入ると、誰もがdogsに親切に現れ、
  • -Dbeaver-Nodejsサーバの配備


    少し嬉しいportでapi crudサービスを作成し、閲覧、削除、変更しました!


    -アルゴリズムレッスン



    reduceはこんなに難しいと思います...自分で活用するときはできません.
    ...
    두번째 문제 정석대로 푼것을 킹갓 메서드로 푼 방법...
    やっぱりアルゴリズムが方法...