scrimba
Code Reviews
Code Review: Christina's Solo Project - Unit converter
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Code Review: Christina's Solo Project - Unit converter
AboutCommentsNotes
Code Review: Christina's Solo Project - Unit converter
Expand for more info
index.js
run
preview
console
/*
1 meter = 3.281 feet
1 liter = 0.264 gallon
1 kilogram = 2.204 pound
*/
/*
**** Praise ****
✅ Number method
✅ isFinite method
clean code
naming conventions
code is consistent
responsive

**** Suggestions ****
- add rounded borders
- clear input field when clicking inside of it
for both error and numbers
- clear converted values when clicking inside
of input field
- increase input field when numbers are several digits long
*/

const numberInput = document.getElementById("number-input")
const convertBtn = document.getElementById("convert-btn")
const errorMsg = document.getElementById("error-msg")
const lengthEl = document.getElementById("length-el")
const volumeEl = document.getElementById("volume-el")
const massEl = document.getElementById("mass-el")

convertBtn.addEventListener("click", function() {
renderConversion()
})

function renderConversion() {
let userInput = Number(numberInput.value)

if(Number.isFinite(userInput)) {
lengthEl.textContent = `${userInput} meters = ${(userInput * 3.281).toFixed(3)} feet |
${userInput} feet = ${(userInput / 3.281).toFixed(3)} meters`

volumeEl.textContent = `${userInput} liters = ${(userInput * 0.264).toFixed(3)} gallons |
${userInput} gallons = ${(userInput / 0.264).toFixed(3)} liters`

massEl.textContent = `${userInput} kilos = ${(userInput * 2.204).toFixed(3)} pounds |
${userInput} pounds = ${(userInput / 2.204).toFixed(3)} kilos`

errorMsg.textContent = ``
errorMsg.classList.remove("border")

} else {
errorMsg.textContent = `Please enter a number!`
lengthEl.textContent = ""
volumeEl.textContent = ""
massEl.textContent = ""
errorMsg.classList.add("border")
}
}

Console
/index.html
-8:28