Join devRant
Do all the things like
++ or -- rants, post your own rants, comment on others' rants and build your customized dev avatar
Sign Up
Pipeless API
From the creators of devRant, Pipeless lets you power real-time personalized recommendations and activity feeds using a simple API
Learn More
If you are teaching a newbie HTML and basic JS using ES6/ES2015 features, the "Hello World" app probably would be:
<!-- index.html -->
<html>
<body>
<div id='container'>
<h2> Enter a Name and Hit The Button</h2>
<input id='name'>
<button id='change-name'>Say Hello</button>
<h3 id='name-display'></h3>
</div>
<script type='module' src="./index.js"></script>
</body>
</html>
//index.js
import {sayHello} from './hello.js';
let displayArea = document.getElementById('name-display');
let input = document.getElementById('name');
let button = document.getElementById('change-name');
button.addEventListener('click', () => {
//displayArea.innerHTML = "Hello World"
displayArea.innerHTML = sayHello(input.value);
});
//hello.js
export const sayHello = (name='World') => {
return `Hello ${name}`;
};
Source: https://github.com/benmccormick/...
random
javascript es6