11 ms·
Show HN: I'm 15 and made a bedtime calculator with React JavaScript
- blauditore 6y agoThose calculations should be taken with a grain of salt: Sleep cycle length of 90 minutes is just a rough average. It varies throughout the night and gets affected by other factors, like sleep deprivation. There are also individual differences. Even more important than the amount of sleep is a consistent go-to-bed time. People tend to sleep better if they do it around the same time every night, maintaining a consistent biological day-night cycle.
- joshternyak 6y agoTrue, I agree. I'll add that consideration to the list
- joshternyak 6y agoEver wake up feeling groggy, even though you thought you had enough sleep? It turns out that by timing your wake up time based on REM cycles, you can wake up more refreshed and more productive. This got me thinking, why don't I put my front-end web development skills to the test and build a tool that will help people optimize their sleep schedule? So, I built a bedtime calculator with React JS, as well as some fancy CSS animations. Looking forward to your feedback and suggestions :)
- houreaction 6y agoif you really are 15, I think you are wasting your time kid. maybe you should learn something useful. maybe go outside or something
- leobabauta 6y agoI think this is a great project for a 15-year-old. My own son did something like this recently, and loved it. Let's encourage that.
- houreaction 6y agodid your son drop out of high school to pursue a degree in web development?
- joshternyak 6y agoThank you!
- houreaction 6y agomy last comment seems to have been removed by the moderators for being contrary to the tone of the rest of the forum, so i will say this: this is like some sort of sponsorship for a mattress company or something if you check the bottom of the page. i don't know why, but it is just very upsetting to me to see that some kid is reviving so much praise for being interested in something as meaningless as web development. As if you learned an instrument or joined a sports team or something. I think this will eventually lead you down the road of forming an identity around work as a programmer, which is not a good thing especially considering the low barrier of entry of becoming a programmer. When i was your age I too got into these sorts of things, and in retrospect I would not have made the decisions I did.
- vowelless 6y agoHow ridiculous. FB is paying $300,000+ per year for React developers. This is an extremely valuable skill to acquire. Even better at such a young age. This kid has a bright future.
- houreaction 6y agothere are more important things than making money, friend. I think we can agree to disagree.
- xupybd 6y agoThere are few things that aren't improved by a good financial situation. This kid is doing very well. Developing marketable skills at such a young age is impressive.
- birdyrooster 6y agoAs Eric Schmidt would say, "revenue solves all known problems"
- jstummbillig 6y ago
- gms 6y agoI have nothing to say other than to encourage you to keep going and ignore any haters. This is really great - I wish I was doing things like this when I was your age.
- onion2k 6y agoThis is great. It's the sort of project that reminds me of the early days of the web; back then people would have an idea, build it, and put it out there on the web for other people to use just because they thought it was useful. Very cool. You've launched something and you've managed to get some very positive feedback. That's more than a lot of other people manage. Make sure you remember how good it feels, and use it as motivation to keep building and launching more projects. I hope we see more 'Show HN's from you.
- phh 6y agoThat's a bit redundant with current top post, but I think this site is really cool, not because of the calculator. I think the calculator itself isn't really useful, though I could be wrong. (The reason why I think it's not really useful is that I think the "90 minutes" cycles varies quite a lot between people, and the time between going to bed and to sleep can vary by half that length between people) But what I really like, is that it is kinda (reasonably) click-baity, while it actually is a short, sourced, clean, no-ad, straight to the point, FAQ about sleep, which is useful to raise awareness of those issues.
- iask 6y agoI find it useful and love it! Congrats. Maybe change the button text to Reset after calculation.
- 191101 6y agoThis is quite nice but I feel a bit too simple. Sleep cycles vary widely from 70-120 minutes per person. I think an advanced mode where a person can input their own record of sleep duration would be nice. Or even getting a couple of sliders to play with varying REM, NREM cycles would be nice.
- joshternyak 6y agoThis is a great idea! I'll plan on adding this soon, if the tool gets more feedback and usage :)
- rckoepke 6y agoOr hook into some wrist heart rate monitors / accelerometers (Garmin, Apple, etc) and correlate heart rate and movement with REM cycles. Wouldn't be surprised if this was already done too but no reason not to try it for a hobby endeavor. Gotta be tons of public research on the correlational methods available on Google Scholar.
- natdempk 6y agoI never knew this. How can someone determine how long their sleep cycle is? I’d love to figure out how long mine is.
- crooked-v 6y agoA good sleep tracking device with an accelerometer can generally record light sleep vs heavy sleep periods. See worn devices like Fitbit Versa 2 or (with the new watchOS 7) Apple Watch 3 and later, or devices that sit on the mattress itself like Withings Sleep.
- deleted 6y ago[deleted]
- svnpenn 6y agoThis was already done years ago: https://sleepyti.me https://sleepyti.me with way, way less JavaScript. Sleepytime jQuery plus HTML is 40 KB. This new site with all JavaScript and HTML is over 600 KB. Seems much of the JavaScript is in creating the time picker. Thats disappointing, as you can do pretty close to the same thing with one line of HTML: <input type="time"> https://developer.mozilla.org/Web/HTML/Element/input/time https://developer.mozilla.org/Web/HTML/Element/input/time Also, why is your name Josh Ternyak, but source of the page has this: <meta name="author" content="Ben Centra"> <meta name="copyright" content="© Ben Centra 2020">
- xeromal 6y agoOh come on, he's a kid. lol
- c0nducktr 6y agoJesus Christ dude. Be nice. Why not try being encouraging instead of.. whatever that was.
- smaudet 6y agoI think that could have been worded much more nicely, but I get the OPs objection - it's sad kids are getting taught "this is the way to do things" and have no idea there was a better cleaner way. I don't think this is the standard 'oh assembly in my granddads day, c in my dads day, ruby in my day, these young tigers and their js' either, there is no benefit to modern frameworks besides vendor lockin, which is an antibenefit. Its mostly a heaping pile that just seems to have more bugs and generally is making the web a horrible place.
- berbec 6y agoMaybe he used this theme? https://github.com/bencentra/centrarium https://github.com/bencentra/centrarium
- cel1ne 6y agoNice work! If you want to get the site-size down, like the top-comment suggested, you can switch from React to preact.
- joshternyak 6y agoOk, thank you for your suggestion!
- mchusma 6y agoGreat project! Happy to see young hackers at work. Doing things like this get you valuable experience, more useful to actually working than school.
- joshternyak 6y agoThanks, I think so too. I'm really glad that I'm able to work on my projects from home instead of going to school right now.
- senectus1 6y agoI'm a long time user of sleepyti.me but i like this interface better. It would be even better if the times displayed and the "try another time" was all on the same page. I dislike having to scroll for instant one off information bytes...
- joshternyak 6y agoThank you so much! I tried hard to make the interface nice by adding cool CSS animations (check out the moons glow!) Good point about the "try another time" feature. I also want to add a "Go to bed now" feature, that will tell you what time to wake up if you want to fall asleep right now.
- Hnrobert42 6y agoWow! The site and its functionality are cool. I am not a web dev, so I can’t say much more than that. What really impresses me is the site’s collection of information and its presentation. It is very thoughtful. Not too much. Not too little. You even included sources for most of your information. Fantastic! Don’t lose focus on your writing skills as you develop your technical skills. Both will serve you well. Great work! If I may make a few suggestions, please consider: 1. The calculator says you should try to “fall asleep at <time>.” Maybe calculate a “bedtime” by including “time to fall asleep.” Default to 20 minutes, but allow the user to adjust. 2. The first sentence tripped me up. “ You should go to bed 5-6 90 minute sleep cycles before your wake up time.” a. It should be 90-minute. See rule 4: https://www.grammarbook.com/punctuation/hyphens.asp https://www.grammarbook.com/punctuation/hyphens.asp b. Consider breaking it into smaller sentences that lead the reader to your point. Something like: People sleep in 90-minute cycles. They need five or six complete cycles to feel refreshed. Waking up mid-cycle feels worse than waking up earlier at a cycle boundary. Use this calculator to determine an ideal bedtime based on when you need to wake up. Anyhow, just some minor thoughts. Overall, it is a great site, and not just a for a 15-year-old.
- joshternyak 6y agoThank you so much for all your encouragement. I will definitely use this feedback to improve the page. Thank you again for all the encouragement and advice.
- xupybd 6y agoAny tips on improving technical writing beyond what you've mentioned here?
- deleted 6y ago[deleted]
- tylerscott 6y agoI found this book to be a wonderful resource on tech writing: https://www.macmillanlearning.com/college/us/product/Technical-Communication/p/1319058612 https://www.macmillanlearning.com/college/us/product/Technic.... You can sometimes find a cheap used copy. The material hasn’t really changed all that much between editions.
- jtchang 6y agoCool site. I actually didn't realize I could scroll down. Maybe a small arrow or something to show that you can go down after you click?
- teniutza 6y agoThat's the beauty of the good old scroll bar: if it's there, you know you can scroll! This does not happen on smartphones and tablets due to the limited space.
- shafkathullah 6y agoBeautiful, really nice!
- joshternyak 6y agoThanks!
- xupybd 6y agoWhat's the link to sleep sources? I hope this kid has found a way to make money out of this.
- deleted 6y ago[deleted]
- petargyurov 6y agoWhy does every project have to make money? Sometimes a side project is just a side project.
- crispyporkbites 6y agoIt’s sponsored content, there’s a link at the bottom
- deleted 6y ago[deleted]
- teniutza 6y agoThis is really cool and nicely made! Congratulations! I'm assuming you don't have years of programming experience (feel free to correct me!) which makes it even more impressive when looking at the things you got right. This include the idea/functionality, layout, source and that cool Moon animation! I would suggest improving a couple of things: 1) defaults: a) some people don't like pickers (especially this "modern" hour then time thingy) and would like to just click the "Calculate" button. I think that the value that you have already set in the picker is good enough for most. b) eliminates issues where the value is not visible in the GUI but it is set in the program. Right now, if you open the picker and click on "Cancel" (or outside the picker) without selecting a time, the input does not show a value but you can click on the "Calculate" button and it calculates using the default value. 2) tables of data: if there's not much data in a table, like in the one the recommended sleep time, do consider copying the data instead of rendering the image. It makes the data searchable (accessibility is important) and, usually, saves an additional request for that resource. Definitely continue! You're on the right path.
- joshternyak 6y agoThanks for the in-depth feedback! I really appreciate it and will look into the issues you found with the app.
- themacguffinman 6y agoThis is great. I've traditionally eye-balled it to be 90 min or 3hr cycles which works as a quick hack, but I'll consider this calculator next time. Can I just say, it looks like you have good design instincts, I hope it takes you far.
- joshternyak 6y agoThanks!
- jfax 6y agoI will put aside my anti-JavaScript zealotry and say this is good, nice, informative, etc. Couldn't be more simple to use.
- INTPenis 6y agoDoes your site explain how to calculate ones own sleep cycle? I couldn't find it, and it's a simple trick I learned from a teacher many years ago. Just choose an evening where you wait until you're feeling sleepy but don't go to bed, start a timer, stay up and after 20 minutes or so you'll start becoming less sleepy. It might help to do something like watching a video program or playing a game. After a while you'll start getting sleepy again, hit the timer. That's a rough estimate of your cycle. Because everyone is different.
- joshternyak 6y agoWow that's interesting, thanks for the tip
- globular-toast 6y agoCool. I learnt some things. I don't care that you're 15, though.
- joshternyak 6y agoThanks!
- naveen_ 6y agoHey man, I like the UI & UX of your website. All the best!
- joshternyak 6y agoThank you!
- Accacin 6y agoI've recently started going to bed at 2000-2100 and it's nice to not need to worry about this stuff anymore. I start work at ~0800 and I'm usually awake from 0400-0600 so I never risk oversleeping, and my body gets as much sleep as necessary. I'm also a morning person, so using the first two hours of the day to work on personal projects or stuff I want to learn is working out well. I guess my professional work can suffer as I start to lose concentration about 1400 but I can live with that!
- joshternyak 6y agoI see, thanks for the comment :)
- jedberg 6y agoI've been using https://sleepyti.me https://sleepyti.me for many years. It's simple and easy, which is usually good when I'm tired near bedtime. I actually like your time picker better, but amusingly since I actually wanted to get up at 8am, I had to flick it slightly back and forth first. Also, sleepyti.me gives me more options, including the "not so healthy" options, which I sometimes need because I don't do the calculation till late in the night but I still want to time my REM cycles. They also have the "I'm going to bed now" button, which tells you when to wake up, accounting for the 14 minutes to fall asleep. I use that button a lot. Overall this is great! Just wanted to provide some comparative analysis.
- joshternyak 6y agoThanks so much for the feedback!
- Semaphor 6y agoMy two best changes for my sleep quality and restfulness were waking up very early (normally between 4 and 5), and usually sleeping for only 6h (7.5 when especially tired). I add 20 minutes as buffer to fall asleep. My Alarm Clock lets me choose between setting an alarm at a certain time, as usual, but also for a certain time span. I have it preset to the time span, so I just enter 6h20m (which is normally already picked from the night before) and I’m good to go.
- joshternyak 6y agoNice, I see.
- kenneth 6y agoDoes not setting an alarm and walking up naturally help avoid waking up during the wrong part of the cycle?
- Tade0 6y agoGood work - no fluff, straight to the point. I got value out of this in under a minute.
- joshternyak 6y agoI'm glad, thanks!
- ryannevius 6y agoI thought sleep cycle length is variable to an extent. I once calculated my own to be around 110 minutes per cycle, rather than 90 minutes. Using that as a base for calculating bed time has worked well for me. If cycle length variability is indeed a thing, it would be an interesting parameter to add to the calculator. Thanks for sharing!
- joshternyak 6y agoI'll look into it, thanks so much!
- gosslot 6y agoThe site looks pretty nice. I have no experience in web design, so no real technical input from my side, but I noticed it is inconsistent with the time representation. You use the 12-hour AM/PM representation in the "I have to wake up at..." picker and in your text below that. But the actual calculated bed time uses the (imo better) 24-hour format. This could lead to confusion, but at least is somewhat inconsistent.
- sverhagen 6y agoIf this is done by a fifteen year old, well done. Given the poor quality of so many web sites, well done regardless. And my apologies if I'm entirely off here, but given how integrated the bedtime calculator is with the mattress sales part of the site, I can't shake the idea anymore that we all fell for clever marketing, here, instead of that we're presumed to be looking at an aspiring, young developer's plea for recognition.
- strogonoff 6y ago> I can't shake the idea anymore that we all fell for clever marketing, here, instead of that we're presumed to be looking at an aspiring, young developer's plea for recognition Marketing play is doubtless; whether the age is genuine or not is a coin toss—as tends to be with affiliate sites, developers go out of their way to avoid referencing a real persona. It’s entirely possible that it was built by a teenager, but then a stronger accomplishment to advertise would’ve been “I have developed an affiliate marketing site at 15 years old”.
- joshternyak 6y agoI was hired by the owner of the site to build the bedtime calculator tool. I do not own the site.
- strogonoff 6y agoInteresting! For some reason I’ve never thought of posting work I’ve done for hire under Show HN label…
- bemmu 6y agoReminds me of this part in Derek's new book on music promotion, on how the very same thing can be perceived very differently based on context. "Imagine you see a caged feather on a museum wall. The sign underneath says the artist is a political activist in jail. Imagine that same caged feather again. But instead the sign says the artist is a high school kid in Florida. Or imagine that the only way to see it is to crawl deep into a shrinking tunnel that opens into a room of mirrors, where the caged feather is suspended by a thread. Same feather. Very different perceptions."
- deleted 6y ago[deleted]
- anon9001 6y agoHey kid, welcome to the club. Career software person here. Here's some unsolicited advice for improvements: * Focus relentlessly on the calculator experience. Why am I pressing "calculate"? What are some ways you could rework it so that I can give quicker input and get more meaningful output? Your goal should be to reduce friction. Maybe let me type in the time in addition to having the android-style clock widget. Definitely show me a series of clocks as I'm updating the picker as I change the time. It's important to let your users play so that they can intuit about the concepts. Also, maybe show extra times for oversleep/undersleep, but accented in such a way that the user knows they're not healthy choices. Maybe include "in x minutes" with the times too. Maybe start the page with the current time + 8 hours selected, showing the live updating output. * Bury all the sleep health and science stuff. It's probably great for SEO, but the star of the show here is the calculator widget. If anything, maybe instead have a short promotional video that explains the science/health stuff briefly and explains what the calculator does. * This would be more useful on my phone, possibly as a native widget. And it would be useful paired with an alarm clock. I'd really like an app (ideally with a widget) that shows me wakeup times based on the current time and lets me quickly set alarms. I always check my phone right before I go to sleep anyway, so it would be easy to click a widget and get proper alarms set. You're probably going to need to learn React Native at some point anyway, might as well do it now. Take this simple calculator, polish it to absolute perfection, give it away for free, and promote it wherever you can. Having one successful app at your age, even if you don't make a dime, will open up so much opportunity for you that it's 100% worth it. Also, it's super hard to get software "right", and it's a drifting target. Look at how much Apple and Google have changed their basic Clock apps over the years. I think doing everything perfectly is usually terrible advice, but at your age and with the simplicity of this project, it's worth trying to be a perfectionist. You'll learn that everything is a lot harder than it looks and that you should be terrified of software development :) Side rant: OP led with "I'm 15", which makes sense, and this wouldn't have frontpaged without that context. I understand that touches a nerve with people who believe the frontpage should be 100% dictated by objective merits. If this place gets overrun with industrious 15 year olds trying to show off their projects to an audience, well, we could have worse problems than that.
- joshternyak 6y ago
- RugnirViking 6y agoThis is really cool. My only critisism is based on the text below, i can't figure out if the times shown take into accound the 10-20 minuites to fall asleep, or if I should get into bed and shut my eyes 10-20 mins before those times.
- joshternyak 6y agoI'll make sure to make that less confusing in the page. You should take into account how long it takes people to fall asleep when calculating your go-to-bed time.
- sidyapa 6y agoKeep making stuff like these, this habit will be the biggest force multiplier in your life. I wish I had started so early. All the best.
- joshternyak 6y agoThanks! I will.
- deleted 6y ago[deleted]
- deleted 6y ago[deleted]
- xariusdrake 6y agoWake up. You can done more.
- deleted 6y ago[deleted]
- KaiIrwin 6y agoThis is great! Keep up the good work:)
- joshternyak 6y agoThanks!
- KaiIrwin 6y agoThis is great! Keep up the good work!
- joshternyak 6y agoThanks!
- cvaidya1986 6y agoVery nicely done!
- joshternyak 6y agothanks!
- cvaidya1986 6y agoCongratulations on wonderful design and shipping product! :) Keep making beautiful stuff!
- joshternyak 6y agoThanks!
- rswail 6y agoI started playing with computers when I was that age. That was 40 years ago. Still play but also get paid for it :)
- joshternyak 6y agoWow, that's interesting.
- jasonlfunk 6y agoGreat work! I'm curious how this tool relates to the rest of the site: https://www.sleepsources.com https://www.sleepsources.com Is it a family-run site that let you create and launch the calculator? Or did you build the whole site? What's the bigger story here?
- martinvol 6y agoWebsite: Since it usually takes around 15 minutes to fall asleep Me with a sleeping disorder: lol (No offence, awesome product!, but I can't use it)
- joshternyak 6y agoLol thanks no worries
- nooyurrsdey 6y agoNice work! I really like that i could drag the minute hand on the clock and it "snap" to the 30 minute value. That's a small but important touch. This is a simple and straightforward. Don't bloat up the site too much and this will be a great project to show off and easy to maintain. Keep building stuff like this :)
- joshternyak 6y agoThanks! Sounds good
- gumby 6y agoThis is great. I have used REM cycle quanta to set my nap times for decades and it has made an enormous difference. My gf’s prolonged use of alarm “snooze” is, imho, a dangerous antipattern.
- joshternyak 6y agoThanks! I'm glad it is a useful tool
- Octopuz 6y agoNice idea. The clocks are one hour off here: the text says 00:55 but the clock shows 11:55 pm, and so on.
- joshternyak 6y agoOh I'll look into it, thanks!
- alasdair_ 6y agoI’ve been coding professionally for almost twenty years. Time (especially DST and edge cases like December 31st and leap years) problems are always going to be a problem. Personal favorite: “the time” in the Gaza Strip depends on whether you are Israeli or Palestinian...
- jakehop 6y agoWell done!
- joshternyak 6y agoThank you!
- abhi_kr 6y agoSo I happened to open this site on Firefox on Android and it's giving me strange bed timings. For wake-up time at 6:00AM, it's showing me the following bed timings: 3:30PM, 5:00PM, 6:30PM Further, I went ahead and opened it on Safari on iPhone where the timings are correct but time format is 24-hrs instead of 12-hrs On Chrome, it works as expected. I'm not a Front-End end dev, so I'm quite curious about what could be causing this difference. BTW, great website. It's very slick and useful. I sent to this my parents who believe Sleeping amounts to wasting time and always keep me nagging about sleeping too much :P
- joshternyak 6y agoThat's strange, I'll definitely take a look into that bug. Thanks!
- lohoho 6y agoI forgot my password, went ALL the way into my email inbox to reset, and then had to think of a new password. It was a lot, as you guys understand, for my tiktok length attention span. But it was worth to say love the builder spirit and what you created. I'm going to try it out. Keep up the good work!
- dosethree 6y agoSweet app, nice job. I've also used this style react time picker and woosh not a fan them for usability
- mikeymz 6y agodid you make the mattress and bed frame site as well?
- annittal 6y agoHow come all the content you write "I am 15" ?
- r0rshrk 6y agoAmazing project. I especially liked all the useful info provided