In this mini-project tutorial we will be building a simple weight converter app using JavaScript and Bootstrap 4 for the ui. It will convert pounds to grams, kilograms and ounces. This will be pure vanilla JavaScript with no JS libraries or frameworks.

CODE: Code for this project

BECOME A PATRON: Get special perks

ONE TIME DONATIONS:

FOLLOW TRAVERSY MEDIA:

COURSES & MORE INFO:

source

49 COMMENTS

  1. Nice project, but it will only calculate grams to lbs and nothing more. Line 66 comes out null for some reason.
    document.getElementById('output').innerHTML = lbs/2.2046;
    document.getElementById('output').innerHTML = lbs*16;

  2. For people using the newest version of bootstrap, the classes to color the cards are 'bg-primary' , 'bg-success', and 'bg-danger'. They have done away with the 'card-success', etc. variants of the background classes.

  3. Hi guys, I know this video was published in July but I kind of need some help with my homework now. Can somebody kindly help me out here? I wanna add a new container and I want it to be beside the container that brad has put there for the weight converting. But no matter what I do, my container with all its forms and cards is placed beneath the main container of this assignment. I tried everything. I even deleted the css of bootstrap and tried to have my own css but I couldn't have the containers stand beside each other.

  4. Traversy Media HELP ME
    How to put an input restriction to 60000 lbs?
    My don't work code bottom 🙁
    *****
    if (isNaN(lbs) || lbs < 1 || lbs > 60000) {
    alert("С такой зарплатой есть особенности. Формулы для вашего дохода находятся в разработке.");
    } else {
    document.getElementById('output').style.visibility = 'hidden'
    document.getElementById('zarp').addEventListener('input', function(e){
    document.getElementById('output').style.visibility = 'visible'
    let lbs = e.target.value;
    document.getElementById('gramsOutput').innerHTML = lbs*0.13 + " руб.";
    document.getElementById('kgOutput').innerHTML = lbs*0.30 + " руб.";
    document.getElementById('kg2Output').innerHTML = ((lbs*0.13)+(lbs*0.30)) + " руб.";
    document.getElementById('ozOutput').innerHTML = ((lbs*0.13)+(lbs*0.30))*12 + " руб.";
    }); ;
    }

  5. how to fix issue on ReactJs when run ur code
    Here the Console Error:
    Uncaught TypeError: Cannot read property 'keys' of undefined
    at Object.n.283.290 (browser.min.js:8)
    at i (browser.min.js:2)
    at browser.min.js:2
    at Object.n.273.283 (browser.min.js:8)
    at Object.n.655.273 (browser.min.js:14)
    at i (browser.min.js:2)
    at browser.min.js:2
    at Object.n.645.634 (browser.min.js:14)
    at i (browser.min.js:2)
    at browser.min.js:2

    so plz help me soon

LEAVE A REPLY