2つ目の難点:刃先計算機の作成

一つ一つ問題を解決する第一歩!
最初に出てきたチップ計算機を作りました.
reactを使用しているため、Javascriptは全体的にぼやけています.
これはライブラリに所属する開発者になる道なのか...という考えが生まれた.
そこで、JavaScriptの基礎をさらに築き、思考とデバッグの能力を養うために、JavaScriptを使って実現してみました.
これは『コードトレーニング』という本を基準にしている.
その本を読んで、基本的なものは実はいくつか提供されました.
特に最初の質問なので、より多くの情報を提供し、必要な内容を要約すると以下のようになります.

**1. Display section.**
 
Inputs:
- billAmount:   
- Tip Rate:  

Expected result
- Tip
- Total

**2. calculate**

Prompt for billAmount with "What is the bill amount?"
Prompt for tipRate with "What is the tip rate?"

convert billAmount to a number
convert tipRate to a number

tip = billAmount * (tipRate / 100)
round tip up to nearest cent
total = billAmount + tip

私もこれは難しいことではないと思います.
InputのBillAmountとTipRateを書けば、あとは計算方法を加えるだけですから.
その考えは正しいですが、反応に慣れすぎたせいか...入力ウィンドウごとに数字が撮れるのですが、数字を外で使う方法を間違えてしまいました.

inputBillAmount.addEventListener("click", updateBillAmountValue);
inputTipRate.addEventListener("click", updateTipRateValue);

let bill;
let tip;

function updateBillAmountValue() {
  let promptNum = prompt("What is the bill amount?");
  inputBillAmount.value = promptNum;
  bill = Number(promptNum);
  updateTotalTip(bill);
}

function updateTipRateValue() {
  let promptNum = prompt("What is the tip rate?");
  inputTipRate.value = promptNum;
  tip = Number(promptNum);
  updateTotalBill(tip);
}

billButton.addEventListener("click", () => {
  inputBillAmount.value = 0;
});

rateButton.addEventListener("click", () => {
  inputTipRate.value = 0;
});

最終的には、ReactのusStateのようにグローバル変数billとtipを使用して、その中の数字を使用します.

function updateTotalBill(tipTarget) {
  globalTipRate = tipTarget;
  resultTip.textContent = Math.round(globalBillAmount * (globalTipRate / 100));
  resultTotal.textContent = globalBillAmount + resultTip.textContent;
}

次に、updateTotalTipという名前の関数にグローバル変数をパラメータとして追加します.
そしてもう一つのグローバル変数を作成して入れました(今は役に立たないようですが...)それを持って現れる公式を作るだけで終わります!
私のJavascriptは知識が限られているので、あまりきれいではないコードで終わりますが、まずJavascriptを利用してある問題を考えて解決したいと思っています.だから、私の目的に迎合するために勉強しています.後で機会があれば、再構築に関する質問をします.