tl;dr

• &: Used as an operator to get the address of a variable

• * in Type: Used to define the type as a pointer (e.g., *int)

• * in Expression: Used as an operator to dereference

In short * does two things and & can only to that one thing.

Example

Can be run here: https://go.dev/play/p/XdA4_qdt7lR

package main

import "fmt"

func main() {
    value := 42 // The original data

    // --- 1. & gets the address ---
    address := &value
    fmt.Printf("1. & Action: get Address: %p\n", address)

    // --- 2. * defines the Pointer Type ---
    // 'p' is declared as the TYPE '*int' (a pointer type).
    var p *int = address
    fmt.Printf("2. Type Definition: 'p' is of TYPE %T\n", p)

    // --- 3. * dereferences ---
    // The '*' operator reads the value at the address stored in 'p'.
    retrievedValue := *p
    fmt.Printf("3. * Operator: Value retrieved via dereference: %d\n", retrievedValue)
}

The struggle - Will the ampersand show up in type definition?

NO, the ampersand will never be used in type definitions, because it only does one thing, it gets the address of the variable. For type definitions we use *.

// 1. * used for type definition
func updateScore(p *int) {
    *p = 99 // 2. * used for dereference and change the value at that address
}

Good Reads

If *p = 99 feels confusing, read this article: https://dave.cheney.net/2017/04/26/understand-go-pointers-in-less-than-800-words-or-your-money-back

Hello Hashnoders! After having so much fun building MoodPraiser for the #harperdbhackathon, and here I am again for the #auth0hackathon!

Big thanks to Hashnode for hosting these events and this time 'round I even persuaded friends to join in the fun. 🎉 Hopefully we'll get to see their articles soon!

What is ReadIndo?

ReadIndo is a tool to help you learn Indonesian through reading text and videos of your choice!

Live Demo / GitHub Repository

Why ReadIndo?

Goal

Fill in the gaps for Indonesian learners by bringing our own content to the table.

The story

I started to learn Indonesian in 2020 because I wanted to chat with Jade Suntoro 宋玉美 in Indonesian. Compared to the popular languages, such as English, German, Japanese, etc., there are comparably fewer resources to learn Indonesian.

Why not build a tool that benefits all Indonesian learners? So here we are!

Tech Stack

• Auth0 - User authentication that's super easy to integrate!
• MongoDB - The database.
• Next.JS - The React framework for production.
• Chakra UI - UI development that's just deadly simple.
• Vercel - Deployment for the app, where the app lives.

Features and Usage

📖 Bring your own content

Paste free text to get started:

Or paste a YouTube URL:

📚 Use our content

Don't know what to read about? ReadIndo got you covered with 5 daily articles!

💾 Save and export word list to Anki

Step 1 Save words

From articles:

From videos:

Step 2 Export word list

Step 3 Import to Anki

Anki is a program that makes remembering things easy! Best of all, it's free and has been one of the best solutions for studying vocabulary with spaced repetition.

Just go ahead and click on "Import File", select the CSV and follow the screenshot below and you're good to go!

🌓 Supports dark and light modes

📱 Responsive on all devices

Challenges and Tidbits

Auth0 Integration

Auth0 has the best documents when it comes to integration! I was using Next.js and it directly leads you to their quickstart guide. All you need to do is follow the steps and within 5 minutes, you're all set up. Auth0 provides everything you need and the developer experience was super smooth.

Performance issues with the interactive transcripts

TL;DR - React.memo to the rescue

One of the main features of ReadIndo is interactive transcripts when watching videos. How do we know which line to highlight? The case here was that the code checks the video duration every 200ms and checks for the correct line to display. The UI had a small lag so I decided to tick the "Highlight updates when components render." box in React Developer Tools and was amazed at what I saw.

The whole transcript is re-rendering every 200ms! Even when the same line was highlighted, the component kept re-rendering!

So here I encountered the perfect case where React.memo could make all the difference.

export default React.memo(
  // One line of transcript
  TranscriptElement,
  (prevProps, nextProps) => prevProps.isPlaying === nextProps.isPlaying
);

If the current line is playing in the video, then isPlaying will be true. Pretty straightforward and obvious. 🤣

So we only need to re-render when isPlaying changes, and voila, instant improvement as we can see below.

Code quality

Maintaining high standards of code quality has always been hard in hackathons due to the time limit. I kept it minimal by choosing the right languages and tools.

TypeScript definitely has been the game-changer:

• TypeScript keeps everything defined and explicit
• TSLint to keep the coding style consistent

Vercel has been the gatekeeper as it will actually run the lint command during the build and make sure everything passes before deploying. So if the build fails, then no new deploys. Therefore, we definitely have to get it fixed in order to ship a new version.

FAQ

Is ReadIndo for me?

If you're interested in learning Indonesian, then yes!

Will ReadIndo support languages other than Indonesian?

The short answer is no.

A case that might be possible is I'm using it to learn other languages but don't worry, all of the code is open-sourced, and feel free to go ahead and extend the project to your needs!

Is my data secure?

The only thing we currently save is your word list. Passwords go through Google if you choose Google login and Auth0 if you register an account with them. ReadIndo doesn't store any user data.

Feel free to ask about anything in the comments below!

Roadmap and User Wishlist

• Save words with context - Save the word with the current sentence to help users understand it better.
• Video catalog - Sometimes we just don't know what to watch, so having a catalog is useful.
• Community features - Learning alone is not as fun as learning with a community, just like writing blogs isn't fun unless we're doing it together on Hashnode!
• Multi-language support - Support languages other than Indonesian, but this one definitely will be a wait because the goal of this project was to help Indonesian learners since resources are more limited.

Contribution and Beyond

ReadIndo is an open-source project and licensed under the terms of the MIT license. You're more than welcome to contribute ideas, report issues or send in pull requests.

Feel free to take it to the next level if needed! Extend ReadIndo to other languages you're learning by forking the project and share with me all the cool things you've added!

GitHub Repository

That's All Folks!

If you read this far, you must have some interest to learn Indonesian, right? 🥺

Let's learn a language other than JavaScript or Python today at ReadIndo!

Leave your thoughts or feedback about the project and don't forget to check out all the other amazing projects for the #auth0hackathon! You'll be amazed at what the Hashnode community can build in a month.

That's it for now and I'll see you in another Hashnode blog post. Thanks for reading and supporting me through my blogging journey!

Stealing this from Wikipedia:

Lightning talks are designed to be short presentations between five and ten minutes long, but are usually capped at five minutes.

Lightning talks usually accept sign-ups after the conference has started, so they can't be found in the conference schedule. Even if the recordings have been uploaded, this is what you'll usually see when trying to find out about them:

Eh! Super hard to know what they're actually talking about. Still, I'd recommend you to watch them!

Why should I care about lightning talks?

They're short! If you're spending hours on YouTube already, please just give it 5 more minutes.

Lightning talks compress months and years of knowledge into less than 5 minutes. Super time-efficient way to learn or hear about something new.

You'll definitely like it because you like reading on Hashnode and you clicked on this article! 😆

Since they're so short and packed with content, it's never boring!

Lightning Talks from RailsConf 2021

To get things rolling, let's start by looking at the Lightning Talks from RailsConf 2021.

• Should You Create a New Rails App as API-Only? - Steffani Brasil
• Programming logbooks - Robson Port
• Pair Programming as a Mentorship - Emily Harber
• Isolate Packages with Packwerk - Dorian Marie
• Inertia.js - Brandon Shar
• Renewables + Rails - Sarah Sausan
• My Team's Recent Gitastrophy - Lauren Billington

Should You Create a New Rails App as API-Only? - Steffani Brasil

When should I choose Rails API?

• Does your client (SPA, mobile native app, etc) render all HTML pages?
• Does your client create all user interfaces
• Does Rails API only need to serve JSON responses to your client

If the above questions end with a yes ⇒ Rails API was built for this!

It's also possible to turn it back into a full-fledge Rails project, so don't need to worry about it!

Talk slides and cheatsheet: https://www.stefannibrasil.me/railsconf/

Programming logbooks - Robson Port

What is a logbook?

A personal and professional reference, mainly used by engineers, about everything related to a project

Why is it useful?

• Divide and conquer: breaking big problems down so it's easier to fix
• Reduces context switching: stuff you need already written down
• Creates an audit trail

What to write in it?

• Write down the initial problems
• Describe
• Write down discoveries or how it was resolved

Example

• App used: JoplinApp (Open source note taking app)
• What to write:
  • Link to ticket
  • Engineering detail

My thoughts

• Why not just Jira tickets / or any ticketing system?

  Might have other roles other than developers looking at it, so the logs might be a bit too much for them.

• Maybe we could use Slack as a logbook?

Pair Programming as a Mentorship - Emily Harber

About Emily

• Early Career Developer at Shopify
• Self-taught
• Started to experience pair-programming at bootcamps
• 3 months after graduating, Emily went into Shopify

How can pair programming help?

• Build confidence
• Practice skills
• Share knowledge real-time
• Everyone knows something you don't know yet

My thoughts

• It's also a good practice for interviewing!

Isolate Packages with Packwerk - Dorian Marie

What is Packwerk?

A Shopify project that enforces boundaries and modularizes Rails applications.

Check the one-minute demo out: https://www.youtube.com/watch?v=NwqlyBAxVpQ

Inertia.js - Brandon Shar

If you want a Rails back end and a React / Vue / Svelte front end?

Get started with Inertia.js here: https://youtu.be/03EjkPaCHEI

My thoughts

If you've been a past user of Django, Laravel, or Rails, definitely take a look at the project!

Renewables + Rails - Sarah Sausan

Sarah's Story

• A story on how she fell in love with Ruby & Rails
  • Ruby is super fun
  • To make something useful, we don't need to know everything about it
  • An opportunity to attend RailsConf
• Geologist caring about Geothermal topics
• Wanted to make data available to the public by using Rails

My Team's Recent Gitastrophy - Lauren Billington

• Rebasing vs merge
• git pull vs git merge
• Story on recovering from breaking production with rebasing and git pull

My thoughts

We all might have encountered this before, but sharing it in a lightning talk let us all know we've been in the same shoes once.

That's all for now and we've taken a look at 7 wonderful topics related to software development. Isn't that fast? You can find all of the talks from RailsConf in this playlist.

Last but not least, for those who are curious about "Is Ruby Dead", you'll find the answer at https://isrubydead.com/.

Love to know your thoughts about lightning talks as well! Please leave them in the comments!

Must-to-have apps to make life easier

• Chrome: I just can't live without it 🤣
• Rectangle: Move and resize windows the easiest way.
• Scroll Reverser: You'll probably need this when using an external mouse. It controls your mouse/trackpad scroll the way you want it to be.
• Clipy: Clipboard extension for mac. I use it to store stuff I copy and paste a lot.
• Karabiner Elements: Map keyboards the way you want them to be. Super useful when using a non-mac keyboard to adjust the order of the keys to be the same as on Mac.
• Sound Control: Mac's built-in sound control isn't that great you know. You can control the volume through your Mac even if it's connected to an HDMI output.

For development

• Docker
• iTerm2: Better than the native Terminal
  • oh-my-zsh
    • zsh-autosuggestions: Remembers your commands for you!
  • homebrew: Package manager for Mac.
  • nvm: Version manager for node.js
  • yarn: The faster npm
• VSCode: Where I write code. Settings sync is super useful!

Others

• Zoom: Choose the Silicon chips version for M1
• Slack
• Notion: Probably relying on it more than I should?

What are your favorite must have apps / tools? Please share them with me! I'd love to know!

Official Guide

There's no place better to get started by going to the official guide! The official guide leads to installing the recommended OS, Raspberry Pi OS (formerly: Raspbian, Raspberry Pi + Debian).

Ubuntu 20.04 + Kubuntu Desktop

I'd like a little something different for Piglet rather than the recommended OS from the official guide. We'll be going with Ubuntu 20.04 + Kubuntu desktop. Not sure about the performance yet, but it's super easy to change the OS if it doesn't work out.

Unfortunately, Ubuntu 20.04 is only available with the server version in Raspberry Pi Imager, so it means will need to deal with the black tty screen in a bit. I didn't notice I installed the server version until I looked back at the screenshots I took.

The reason for choosing this is because Ubuntu 20.04 has LTS (long term support) whereas Ubuntu 21.04 Desktop (the only desktop version available in Raspberry Pi Imager at the time of writing) will only be supported until 2022. Below is a snapshot from Ubuntu's website. That being said, it doesn't really matter much which option we choose because as said earlier, switching OS is extremely easy. I just wanted to feel good with Piglet by logging down a reason. 🤣

Useful links

Install Ubuntu on a Raspberry Pi | Ubuntu

Ubuntu release cycle | Ubuntu

Step-by-step Screenshots

1. Raspberry Pi Imager on Mac. Click on "CHOOSE OS"

2. Select "Other general purpose OS"

3. Select "Ubuntu"

4. Select "Ubuntu Server 20.04.2 LTS"

5. Select the SD card

6. All set and click on "WRITE"

7. "YES" we want to continue

8. Here we go

9. Writing...

10. Almost there

11. Yay and we've prepared the SD card

12: Insert the SD card

Next Steps

We're all set so let's plug in Piglet and start it up!

Switch to tty2

Since tty1 will be stuck letting you know that Piglet is running fine, so we'll need to switch to tty2 to run the commands. Switching is easy by using ctrl+alt+F2.

Install Kubuntu Desktop

sudo apt install kubuntu-desktop

Troubleshooting

GUI not running

startx

Black borders

# open /boot/firmware/usercfg.txt
disable_overscan=1

Useful links

Ubuntu Wiki

Conclusion

I might need to switch to Raspberry Pi OS in the future (lol). I think a lot of extra effort is needed to run everything smoothly on Kubuntu. I tried watching YouTube videos after getting it running and it felt super stuck.

The temperature was around 70+ degrees Celcius when running Kubuntu. If we're only running the server and not connected to a monitor, it was around 60 degrees. Room temperature should be around 27 degrees. Not sure if this is too hot but I did see the overheating icon when I was in Kubuntu.

That's it for now and I'll probably stick to using the server itself via ssh so that I don't overheat Piglet.

Piglet: Hello world!

Navigation

• Start of the Journey
• Preparation
• The Interview Journey
• Receiving the Mid-level Badge
• Thoughts on Junior, Mid-level, and Senior
• To Be Continued

Start of the Journey

It’s been over 3 years since I joined my current company after graduation. I thought it was time and an opportunity to see if I was still competitive in the job market. Hence, the start of my interviewing journey.

Background

I would probably fall in the "made a transition" category due to my non-CS background. Below is a brief background information:

• Majored in Marketing and Biotechnology (Biomedical Engineering)
• 3-4 years of experience
  • 70% front end / 30% back end & other stuff
  • Built products with over a million users
  • Built web applications from 0 to 1
  • Deployed and maintained existing applications
• Front End Stack: JavaScript, HTML, CSS, React, Vue.js

Senior Front End Engineer

After gaining some real-world experience, I decided to take on the challenge and apply for senior positions. Unfortunately, as the title states, I didn't get the offer I was aiming for. On the other hand, I got the chance to face up and see where my weak spots were.

Let's see how far I survived!

Preparation

• Resume
• Cover letter

End.

I admit I was lazy. Well, I still had a decent job in case all fails. There's nothing to lose, right?

My first interview was a disaster. In addition to my laziness, the past 3 months before interviewing, I was doing 90% DevOps and barely wrote any React for half a year. So believe me, when I say disaster, I mean it literally!

Getting back to the topic of preparation, I took notes right after each interview when the awfulness was still vivid and looked up everything immediately. Believe it or not, the same questions get asked over and over again.

I definitely suggest reading articles on interviewing including the one you're reading right now.😊

The Interview Journey

Here we go!

No company names will be mentioned here since I'd appreciate some anonymity.

Resume & Cover Letter

After all, I only prepared my resume and cover letter, this was the part I am the most confident. 80% of my applications got a chance to move to the next stage of the interview. All except one were applied without a referral, so a well-crafted resume and cover letter can go a long way. Let's not forget that moving forward to the initial interview turns the odds of getting an offer from impossible to possible.

This was probably the only thing I did right this time around.

Assignments

Assignments were super common for the front end interviews that I've gone through. Assignments have always been quite a controversial aspect of the interview process. I'm not going to deny the fact that assignments consume (waste) a lot of time and you had to put that much in while still far away from an offer. However, it offers a way of evaluating the candidate more thoroughly in my opinion.

I spent around 6-12 hours on each assignment, trying my best to make a good impression. After turning in the assignment, there would be a one-hour call to discuss it. The majority of the 1-hour call would be around these aspects:

• Architecture
  • Why is your code structured this way?
  • Why did you choose method A and not method B?
  • What are your criteria for splitting components?
  • Object-oriented programming (OOP) principles
• Testing

The feedback I received before we started the one-hour call were:

Project has good architecture and structure. Code is very easy to understand and get around.

Wow! That's the good impression I was aiming for!

But! But! But!

I did a poor job at talking about my architecture and design decisions which probably threw me out of the "senior" window. In retrospect, I relied on my guts when making these decisions. If I couldn't even persuade myself why structuring code this way would be easier to maintain and test, there's no reason that other people should be convinced, right?

Despite my weak performance, I got lucky and moved forward for every assignment I had done. Huge relief since I spent an enormous amount of time doing it!

Be prepared to have your thought process laid out and convey your architecture designs clearly to the interviewer.

Technical Interview

Since this is the most prevailing part of the interview process, here's the list of the most common stuff that I was asked about:

JavaScript

• Asynchronous
• Closure
• Event loop
• Promise
• Hoisting
• When choosing a library / tool to use, how do you evaluate it?

React

• Why React hooks? What benefit does it bring?
• Performance: useMemo vs. useCallback
• Reconciliation
• Class components / Functional components

CSS

• Centering elements
• Styled-components

Web

• What happens when you input https://google.com in the browser?
• TCP/IP
• HTTP

Live Coding / Whiteboarding

As for the dreaded coding test, I faced it only twice. Definitely less than I expected. One was to implement a debounce function and the other was a LeetCode medium problem.

The two surviving tactics for live coding or whiteboarding are to ask clarification questions and think out loud. By applying them, I got to know right away whether I was in the right direction by observing the reactions of the interviewer. Also, it became an excellent chance to demonstrate my communication skills.

There were no twists and turns for the questions during the technical interviews. They were not hard and preparation will pay off big time! I paid the price for not preparing by ruining the first two interviews and got better eventually.

Common interview questions aren't called common for no reason!

Good reads on Hashnode for JavaScript:

🎯 JS Interview Checklist - Part 2 (Advanced)

Tricky Javascript Code Snippets Asked In the Interview

Meeting the Team / Behavioral Interview

Yay! The most non-technical part of the interview!

After going through it a couple of times, here's the list of "common" questions.

Collaboration / Communication

• You would like to introduce a new library / framework into the project / company, how would you communicate with the team about it?
• What would you do if you disagree with the designer?
• If given a task you've never done before, how would you approach it? How will you be confident that you can come up with a solution?

Personal / Motivation / Goals

• Received an assignment to learn an unfamiliar skill and give output about it in 30 minutes.
• What is your career goal / personal goal?
• What motivates you during work?
• Why do you want to join us?
• Why do you want to leave your current company?
• How do you see yourself in 3 years?

Some of these questions were answered while crafting my resume, so I guess I somehow prepared for it.

Receiving the Mid-level Badge

I didn't get that senior front end role as mentioned from the title, so here's what happened in the end. I received the mid-level badge from multiple parties.

All of the companies that I interviewed with replied that they would still move me forward if I could accept a mid-level position.

One company that rejected me before also reached out after a month, saying that there was a new position opened for mid-level engineers. They said that if I was still interested, I could keep going with the interview process without starting all over.

All in all, it wasn't as bad as I thought and there were no hard rejections.

Thoughts on Junior, Mid-level, and Senior

Instead of mentioning how many years of experience is expected like a typical job description, here are my two cents of their differences.

Note: This is only my point of view that I wanted to log down for reference so please don't view this as a standard.

Junior

I started coding to solve problems and it just works. Period. At this stage, I could implement features for our projects, but sometimes I get really stuck and need help from more senior members.

• Build stuff that works and fulfills given tasks
• Might not have a good understanding of why it works

Mid-level (I’m here 👋)

It's a bit awkward to get stuck somewhere in the middle, but here I am.

Implementing features independently usually isn't a problem, unless it involves complicated algorithms and math calculations. It is the how to implement it to make life easier for the team as a whole that bothers me. Reaching more into the fundamentals will definitely help with the process.

On the other hand, I started to mentor junior members as well as pay more attention to code reviews (but did an awful job looking back). As the codebase grows, I experienced how testing became a "must to have" instead of a "nice to have". Situations such as code changes meant to fix B accidentally break A started to happen a lot more frequently. Also, I discovered how crucial architecture and structure became because it encouraged coding style and practices for newcomers, no matter their seniority.

In short, the need to collaborate forced me to care about aspects beyond making things work.

• Build stuff and fulfills tasks efficiently
• Better understanding of why it works
• Code in a more collaborative sense
  • Architecture
  • Testing
  • Mentoring
  • Code review

Senior

I'm not here yet, so this is what I'm hoping to achieve for the next milestone.

The ultimate goal is to be able to accelerate collaboration and be a multiplier for the team.

• Expertise in the fundamentals
• Architect and enforce coding standards
  • Identify the trade-offs for decisions
  • Confidence for code quality
• Mentor and encourage a positive culture
• Cross-team collaboration

As for going beyond the senior level, I imagine the actual time spent in writing code will become less and less evident. The focus would be switching to communication, planning, and architecting the project with reference to past experiences and the ability to draw thoughts from others. It's kind of like how CEOs don't really do much of the daily work, but everything that they do will have an enormous impact compared to us.

These are just my thoughts for now. I’m still learning along with my career and would love to know your thoughts on the different levels too!

To Be Continued

I wanted to write this down as a reference for my future self because this time around I didn’t take up a front end job. If you ask me what happened? Well, that’s another story.

All in all, I do see myself staying in the field for the long run (let's say at least 10 years), so there definitely will be new chapters written. After this experience, I believe putting yourself into the job market every 1 to 2 years is a healthy thing to do. Not only do we get to know if we're still competitive, but it is also a great opportunity to see how are we growing in our career with a totally different set of eyes. We don't actually need to be "looking for a job" to do it.

That's the end of my first post on Hashnode? It was supposed to be the first post until the HarperDB Hackathon came along and snagged my priorities! Shameless plug here for MoodPraiser, the project I built for the hackathon.

What's your interview story? Please share in the comments and I'd be more than happy to read about it!

I'm Candy. Super excited to share MoodPraiser with y'all! Huge thanks to the #harperdbhackathon to keep me motivated throughout the month. It definitely wasn't easy to pick up the keyboard after work every day.

What is MoodPraiser?

MoodPraiser is a simple, useful and fun habit tracker that keeps you and your friends accountable for each other by giving praises y'all deserve to reach your goal!

Live Demo / GitHub Repository

The Story Behind MoodPraiser

Guess what? This wasn't intended to be a habit tracker in the first place! The project name gives itself away as a "mood" praiser. Yup! It was supposed to be a mood tracker. What happened?

I've always wanted to build a super simple mood tracker so I came up with the name during early June. Then I left the name and the project there to hang until I realized I wouldn't be able to complete it in time because I wasn't working on it. 😂

I believe a lot of people are like me:

1. Start a new habit
2. Execute it for a few days
3. Forget about it
4. Back to step 1

Let's call this the deadly "start a new habit" loop.

In order to escape the loop, MoodPraiser became a habit tracker with me being the first user. Here I am, participating in a hackathon with a project to make sure I complete the hackathon. How hilarious! 😂

To make things more fun, a praise feature was implemented so that we can receive praises from friends and families to keep ourselves going. Also, it's a good chance to get them to signup and get themselves out of the loop!

That's the story of how MoodPraiser turned into a habit tracker to keep everyone out of the deadly "start a new habit" loop!

Tech Stack

• HarperDB - The Database known for simplicity without sacrifice!
• Auth0 - User authentication that's super easy to integrate
• Next.JS - The React framework for production
• Chakra UI - UI development that's just deadly simple
• Vercel - Deployment for the app, where the app lives

Features and Usage

🌓 Supports dark and light modes

📱 Responsive on all devices

✏ Track your habits and moods

Create habit

Track your mood and habits

Yay the mood part is still alive, tied together with the habit tracking!

🥰 Earn praises by sharing the praiser link

Step 1: Copy the praiser link

Step 2: Share it with your friends

Step 3: Praise your friends back

Hurdles Along The Way

After having the project idea in mind with some basic features, it's time for implementation! It's my first time releasing a side project to the public with the front end and back end all built on my own.

Choosing the stack

• Database - Easy choice and you know why! HarperDB to the rescue!
• Authentication - I didn't feel comfortable going through sensitive information, so I chose a trustworthy Auth0 which also supports login with third-party services such as Google.
• Front End & Back End - I wanted to use TypeScript for everything and manage APIs easily. Loved using React and also heard about the Next.JS for quite some time. Next.JS fulfills all my wishes so I definitely should try it out.
• Deployment - Since I chose Next.JS, Vercel as the main contributor behind it supports deployment for it like no one else. Only a few clicks away from deploying the app's front end and back end automatically. Super easy to setup!

Database

HarperDB exposes a REST API along with example code and a Postman collection to start out, it was super easy to follow. I didn't find the need to use a wrapper library. CRUD operations can be called easily without much hassle.

Below is the how I structured the database to save all the data I needed for MoodPraiser to work.

One thing that I'd like to mention was when I was altered the database schema, such as removing columns from a table, sometimes I was unable to delete rows in the database after that. Due to the project hasn't been released yet, my tentative solution was reconstructing the table.

Querying

I'm awful with SQL queries and have always wanted to practice it in a real project instead of following tutorials. Truly love the HarperDB Studio since we can try out queries directly from the GUI. Although complicated queries are not supported, but it fulfills most of my use cases in the project.

Code quality

Currently going live with absolutely 0 tests written. Here's what I'm relying on currently:

• Linter to keep coding style consistent
• Relying on TypeScript types to get the parameters right

Will be planning to add tests and run CI with GitHub actions in the future.

FAQ

Who is suitable for MoodPraiser?

Anyone and everyone! You can use it by yourself and praise yourself, or let your friends join in the fun as well!

Where is my data saved?

Application data such as user profiles, habits and praises are saved in HarperDB. Passwords goes through Google if you choose Google login and Auth0 if you register an account with them. MoodPraiser don't have access to all passwords.

Feel free to ask about anything in the comments below!

What's Next?

• Reminders - Email reminders so that you won't forget to log your accomplishments.
• Edit profile - Ability to change the display name, add an avatar, etc.
• Badges - Gamify MoodPraiser! Some ideas in mind are: creating your first habit, getting your first praise, etc.
• More statistics - Show if you've been praised today, more history stats, etc.
• Internationalization - Hopefully I can support many languages in the future. For now, planning to support Chinese since it's my mother tongue.
• You name it - Feel free to comment on what features you would like to see!

Contributing

MoodPraiser is an open source project so you're more than welcome to contribute ideas, report issues or send in pull requests!

GitHub Repository

Kudos for reading this far! Love to know what you think about the article and the project.

This is also is my first post on Hashnode! Extremely thrilled that I joined in time to participate in the hackathon.

Shameless plug: Moodpraiser