Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: I'm 15 and made a bedtime calculator with React JavaScript (sleepsources.com)
312 points by joshternyak on Aug 13, 2020 | hide | past | favorite | 121 comments



Ever 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 :)


I 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.


This 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.


That'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.


I find it useful and love it! Congrats. Maybe change the button text to Reset after calculation.


[flagged]


I 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.


Thank you!


[flagged]


How 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.


[flagged]


There 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.


As Eric Schmidt would say, "revenue solves all known problems"


And he would be wrong. But probably, hopefully, also not entirely serious.


Haha yeah I know he’s a mess of a human being.


I got into software because I loved it as a kid. I'm also surrounded by people constantly complaining about crippling student debt, expensive housing, the current job market, unhappiness at work, a lack of satisfaction in their life - problems I don't have to deal with because I made good money doing what I love at a young age. Am I missing any other "more important" things? Give the kid a break - this is cool and I'm glad they're showing off a project here.


OP having these skills now means more free time in University or easier time finding first dev jobs which will pay off in the future. Compound interest and all that.


does doing what you enjoy - whatever that is - qualify as "more important things"?


Your first comment was flagged (by users) because it added no value and seemed more or less like a projection of your own problems onto OP.


[flagged]


Sounds like you're jealous of this kid's skills. What have you built?


Wow! 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

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.


Thank 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.


Any tips on improving technical writing beyond what you've mentioned here?


Write in active voice. That's the single most important lesson I learnt when writing technical specifications.

The #1 goal of technical writing is to be clear and accurate, so passive voice should take a back seat unless you cannot phrase it otherwise. Active voice lets you convey clearer, more concise statements that describe a concept.

Take for example "the ball was thrown by the man" vs "the man threw the ball". The latter is much more concise and easier to parse because the active object preceeds the passive one and so the concept unfolds linearly.

If you're using Word for writing, go into options > proofing > find 'writing style' and hit 'settings' > turn on 'passive sentences'. I just throw it to the default 'grammar & style' because I'd prefer to know of and actively decide against style issues than not. It's helped drill my writing significantly.


Thanks for the tip for Word! Those settings are put real deep in the options.


I am no expert, but a few things that helped me:

1. Read lots.

2. 30 Days to a More Powerful Vocabulary by Norman Lewis. Some the words I have inly encountered once or twice in the intervening 25 years since I read it, but many others I hear every day.

3. The Elements of Style by Strunk and White. It’s like any other instruction manual. It’s worth reading, even if you don’t follow them.


I found this book to be a wonderful resource on tech writing: 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.


I've been using 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.


Thanks so much for the feedback!


Great work!

I'm curious how this tool relates to the rest of the site: 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?


Keep 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.


Thanks! I will.


This 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.


I never knew this. How can someone determine how long their sleep cycle is? I’d love to figure out how long mine is.


A 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.


This is a great idea! I'll plan on adding this soon, if the tool gets more feedback and usage :)


Or 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.


This 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.


Thanks for the in-depth feedback! I really appreciate it and will look into the issues you found with the app.


I will put aside my anti-JavaScript zealotry and say this is good, nice, informative, etc. Couldn't be more simple to use.


I started playing with computers when I was that age. That was 40 years ago. Still play but also get paid for it :)


Wow, that's interesting.


This 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.


Thanks! I'm glad it is a useful tool


Does 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.


Wow that's interesting, thanks for the tip


I'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!


I see, thanks for the comment :)


Those 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.


True, I agree. I'll add that consideration to the list


The 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.


So 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


That's strange, I'll definitely take a look into that bug. Thanks!


What's the link to sleep sources?

I hope this kid has found a way to make money out of this.


Why does every project have to make money? Sometimes a side project is just a side project.


It’s sponsored content, there’s a link at the bottom


Cool. I learnt some things. I don't care that you're 15, though.


Thanks!


My 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.


Nice, I see.


Great project! Happy to see young hackers at work.

Doing things like this get you valuable experience, more useful to actually working than school.


Thanks, 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.


I 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!


I'll look into it, thanks so much!


Nice 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 :)


Thanks! Sounds good


I 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!


Nice work!

If you want to get the site-size down, like the top-comment suggested, you can switch from React to preact.


Ok, thank you for your suggestion!


This 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.


Thanks!


This 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.


I'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.


I'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...


Thank 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.


Cool 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?


That'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.


Website: 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)


Lol thanks no worries


Nice idea. The clocks are one hour off here: the text says 00:55 but the clock shows 11:55 pm, and so on.


Oh I'll look into it, thanks!


I’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...


Does not setting an alarm and walking up naturally help avoid waking up during the wrong part of the cycle?


This is great! Keep up the good work!


Thanks!


Sweet app, nice job.

I've also used this style react time picker and woosh not a fan them for usability


Congratulations on wonderful design and shipping product! :) Keep making beautiful stuff!


Thanks!


Good work - no fluff, straight to the point. I got value out of this in under a minute.


I'm glad, thanks!


Amazing project. I especially liked all the useful info provided


Hey man,

I like the UI & UX of your website.

All the best!


Thank you!


This is great! Keep up the good work:)


Thanks!


Wake up. You can done more.


Hey 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.


Hi, thanks so much for the helpful feedback! I'll definitely look into improving the app.


Beautiful, really nice!


Thanks!


did you make the mattress and bed frame site as well?


Very nicely done!


thanks!


If 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.


> 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”.


I was hired by the owner of the site to build the bedtime calculator tool. I do not own the site.


Interesting! For some reason I’ve never thought of posting work I’ve done for hire under Show HN label…


Reminds 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."


Lately I can’t help wondering how emergence of aggregating platforms like YouTube (your video is in the same place as “500 Funniest Fails 2020”) or Spotify (your song appears next to generated muzak by fake artists) and arrival of mobile devices (your work, no matter how special to you, can be absorbed by someone sitting on a toilet) are shifting the context in which art is perceived and affecting the art itself.


It's not quite the same thing, but on your comment about the platform affecting the art, you might find this dicussion about music interesting: https://www.theverge.com/2019/5/28/18642978/music-streaming-...

> One of the main things that has changed is how people are getting paid, and it’s is affecting how songs are being written. In the past, you used to get paid if you sold an album or a single. In 1995, we had songs that were coming in at four minutes and 30 seconds. Today, songs are down to three minutes and 42 seconds, because of the difference in how artists are getting paid now. Instead of getting paid by physical sales, you’re getting paid in a stream, which only counts if someone listens to 30 seconds of a song. It actually makes sense if you can have more songs streamed at a time, which means that you want to pack your album full of much shorter songs. So if you have an album like Drake’s Scorpion, which is a really long double album coming in at almost 90 minutes, he’s got a ton of really short songs on there, because he gets paid for every song you listen to, whether or not you listen to the whole album.

> Not only are songs getting shorter, but the way artists are introducing their songs is changing. Gone is the era of long intros that sort of slowly get you into the song. Today, we are not only seeing songs getting shorter, but there is a sort of a new song structure that we’ve observed that we’ve called the pop overture, where basically a song, at the very beginning, will play a hint of the chorus in the first five to 10 seconds so that the hook is in your ear, hoping that you’ll stick around till about 30 seconds in when the full chorus eventually comes in.


You are right. Your comment combined with dozens of inane one line exclamations about how well done, great, etc. this is made me kinda suspicious. And indeed, one of his previous submitted links is some kind of guide on how to clean tile floors in 2020. Some of the commenters here are commenting twice, saying basically some thing and even their history is full of low effort comments.

Nobody can convince me this isn't a spam ring.


If I can join the guessing game. It could also be that a 15 yr old was asked (or offered) to add this functionality for the mattress company and he's "showing" off here on HN


Sleepsource is definitely not the brainchild of a 15 year old. Yeah, it'd be nice to know why this app wasn't built as a stand alone page.


According to their facebook it seems like the entire sleepsource site is theirs.

"I am a 15 year old front-end web developer and am working on growing sleepsources.com"

https://www.facebook.com/josh.ternyak.3


* By building a bedtime calculator tool. I do not own the site.


OK, then I'm impressed. Kudos to that kid


I was hired by the owner of the site to build the bedtime calculator tool. I do not own the site.


I was hired by the owner of the site to build the bedtime calculator tool. I do not own the site.


Well done!


Thank you!


[flagged]


Jesus Christ dude. Be nice.

Why not try being encouraging instead of.. whatever that was.


I 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.


Maybe he used this theme? https://github.com/bencentra/centrarium


Oh come on, he's a kid. lol




Join us for AI Startup School this June 16-17 in San Francisco!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: