How I made a Product of the Day in six lines of JavaScript
> TL;DR: Focus on your task. It matters the most, more than any tools ever will.
Iāve recently built and published The Code of Conduct Generator that surprisingly for me become the Product of the Day.
Iāve built it in around two hours. What really amazed me is how much impact a product so simple did.
It uses no React or Vue.
Aside of the template, itās just a six lines of plain JavaScript:
document.getElementById('settings').addEventListener('submit', e => {
e.preventDefault()
let params = {}
Array.prototype.slice.call(document.getElementsByClassName('data')).forEach(
node => { params[node.getAttribute('id')] = node.type === 'checkbox' ? node.checked : node.value }
)
document.getElementById('main').classList.add('done')
document.getElementById('result').innerHTML = template(params)
})
- When āSettingsā form is being submittedā¦
- Prevent page from reloading
- Declare āParamsā dictionary
- Remember every single thing user entered
- Tell document body that code of conduct is ready
- Generate the code of conduct from the template and values that the user entered
The Code of Conduct Generator asks you to agree or not on some of the heavily opinionated topics to build a Code of Conduct for your community.
Do you know why it required only two hours to build, from the idea to the final, fully-functional product? Because I spent no time fiddling around with fancy tools that many of us consider as āde-facto standardsā.
Just go and use React, thatās how cool guys so it these days! Yes, you definitely need modern tools to build useful projects.
Or am I wrong?
Lessons learned
You donāt need any of that fancy stuff to build great, useful products. People donāt give a damn about the tools youāve used, the functionality is all that matters.
You donāt need React. You donāt need functional programming. You donāt need Kubernetes or Docker.
There are no cool guys. There are no tools you need. Just go and unleash your creativity building things with tools you know well. Now this is cool.
Allow no one to say the opposite.