DEV Community: marie ng

Went on a quest to make the most realistic, satisfying virtual fidget spinner!

marie ng — Thu, 19 Aug 2021 23:46:59 +0000

Hey all,

I taught myself to code around a year a half ago, and a few weekends back I wanted to build something creative...so thought I'd try and make the most realistic, satisfying, virtual fidget spinner.

I know the fidget spinner craze was a while back but I still use my physical spinner, as well as a fidget cube, and poppit all the time!

Anyway, just wanted to share, as I'm pretty proud of it, and thought maybe others here might appreciate it.

https://fidgetpage.com

It's using React, React Spring and a really cool library I found called Propeller to create the inertia effect.

To make it feel even more realistic I added a fidget spinner sound effect from freesound.org (a great resource for sounds!) and made the volume increase as it spins faster.

Would love to hear what you think!

(Full disclosure, it does mention another product I'm making, but that's seperate and not required at all to use the fidget spinner)

☝️ One thing which has helped me IMMENSELY in learning React...

marie ng — Tue, 23 Feb 2021 07:27:26 +0000

For context, I started my coding journey about a year ago: with html, css, javascript -> React 👩🏻‍💻

One thing which has helped me, is working on a SINGLE project, and re-factoring that over time 🔁

This is not to say BREADTH of experience is not important. It is. Do a variety of small projects and learn from many different people 👨‍👩‍👧‍👦

But...

...DEPTH of experience on a single project has helped me immensely! 👍

This was my progression for learning:

Find a project you like on CodePen (or similar site). When I started learning vanilla javascript, I found a basic to-do list on CodePen, copied over its html/CSS but deleted all its javascript. Then practiced re-writing my own. This way you're not trying to do too many things at once, but are honing in on one area...in this case javascript.
Improve upon the design. After I had re-written the javascript, I practiced re-designing the to-do list with my own CSS. Again, deleting what was there and starting that part from scratch and to my own liking.
Next I wanted to learn React. So I re-factored the whole application using React class-based components.
Then re-factored the whole application again using functional components and React hooks.
Lastly, I wanted to learn Styled Components, so I re-wrote all my CSS classes using a Styled Components approach.

This has been incredibly helpful to me, as it allowed me to see how the same functionality could be implemented with different approaches.

And it really made me appreciate the relationship between vanilla javascript and React as a framework.

Using this approach, I started off with a very basic to-do app:

https://twitter.com/threehourcoffee/status/1225241414667161600

And turned it into the project I work on now:

https://llamalife.co/

(it is a to-do list that lets you add a timer to each and every task)

Hope this is helpful! Any questions, feel free to ask in the comments.

Image source: @visualashish

Taught myself to code 1y ago & recently released my first solo product. My biggest tip for learning...🧠

marie ng — Fri, 05 Feb 2021 03:57:21 +0000

I spent 10yrs in a career of branding/advertising and went from knowing no programming to launching my first product in a year.

Super proud to share I just hit a personal milestone of 150 paying customers.

It's been quite an emotional ride but wanted to say if you're just starting out, keep going, it's totally worth it, whether you want to build your own business or switch to a career as a software engineer.

The biggest tip I can provide is to figure out your learning style. I tried first with books, but I'm terrible with reading and originally gave up telling myself I didn't have time. Then I moved on to watching videos and something magical just clicked.

I learned by doing a short course on Udemy and then just watching a ton of YouTube.

For context, here's what I built: https://llamalife.co

(It's a productivity application which helps provide structure and focus to get work done).

Feel free to ask anything about the journey.

Not going to lie, it was a hard slog, but extremely happy I did it. And the feeling you get from knowing you built something, by yourself, is amazing :)