Sign Up & Log In

Sign Up & Log In

Skillnote supports three ways to sign up and log in: Google, GitHub, and email. When you visit a page that requires authentication, the log-in modal appears automatically.


Opening the Log-In Modal

The log-in modal appears automatically in the following situations:

  • When you navigate to a page that requires authentication, such as writing a post or starting a review
  • When you click the profile area at the bottom of the sidebar

The modal header displays the Skillnote logo along with the message “Log in to access more features”.


Switching Between Log In and Sign Up

Use the toggle at the top of the modal to switch freely between “Log in” and “Sign up” modes.

  • “Log in” tab: The screen for signing in to an existing account
  • “Sign up” tab: The screen for creating a new account

Social Log In (Log In Mode Only)

Social log-in buttons are only shown in Log in mode. Switching to Sign up mode hides the social buttons.

Continue with Google

  1. Click the “Continue with Google” button in the modal.
  2. The Google account selection screen opens.
  3. Select the Google account you want to use and you will be logged in to Skillnote automatically.
  4. If this is your first time logging in, you will be taken to a step to enter additional information.

Tip: Logging in with Google means you don’t need to remember a separate password.

Continue with GitHub

  1. Click the “Continue with GitHub” button in the modal.
  2. The GitHub authorization screen opens.
  3. Authorize with your GitHub account and you will be logged in to Skillnote automatically.
  4. If this is your first time logging in, you will be taken to a step to enter additional information.

Tip: If you’re a developer, connecting with your GitHub account is a natural and convenient choice.


Log In with Email

The email log-in form is located below the “or” divider under the social buttons.

  1. Enter the email address you used to sign up in the Email field.
  2. Enter your password in the Password field. Click the eye icon on the right to show or hide your password.
  3. Click the “Log in” button. While processing, the button changes to “Logging in…”.

Forgot Your Password?

In Log in mode, click the “Forgot your password?” link to go to the password reset flow. See the Password Reset section below for details.


Sign Up with Email

Select the “Sign up” tab at the top of the modal to display the email sign-up form. Social log-in buttons are not shown in Sign up mode.

  1. Enter the email address you want to use in the Email field.
  2. Enter a password in the Password field (minimum 6 characters). Use the eye icon to toggle password visibility.
  3. Re-enter your password in the Confirm Password field.
  4. Click the “Sign up” button. While processing, it changes to “Signing up”.
  5. You will be taken to the email verification step automatically.

Email Verification

After signing up with email, a verification link is sent to the email address you entered and the modal transitions to the next screen.

  • Heading: “Check your email”
  • Message: “We sent a verification link to your email address. Please check your inbox and click the link.”
  • A “Waiting for verification…” spinner is shown while waiting for you to complete verification.

Completing Verification

  1. Click the verification link in the email you received.
  2. Click the “I’ve verified my email” button in the modal. While processing, it shows “Checking”.

Resending the Verification Email

If the email hasn’t arrived, click the “Resend verification email” button. After resending, a cooldown timer is shown (“Resend in N seconds”) and you can resend again once the timer expires.

Note: If you don’t see the verification email, check your spam or promotions folder.


Password Reset

If you’ve forgotten your password, you can reset it through a 3-step flow.

Step 1: Enter Your Email

Click “Forgot your password?” in the log-in modal to switch to the reset screen.

  • Heading: “Reset Password”
  • Message: “Enter the email address you used to sign up.”
  • Enter your email address and click “Send reset link”. While sending, it shows “Sending”.
  • Click “Back to log in” to return to the log-in screen.

Step 2: Waiting for the Email

  • Heading: “Password reset email sent.”
  • Message: “If an account exists for that email address, a reset email has been sent.”
  • Additional note: “The reset link is valid for 24 hours.”
  • A “Waiting for verification…” spinner is shown.
  • A “Back to log in” button and a “Resend verification email” button are shown. After resending, a “Resend in N seconds” cooldown applies.

Step 3: Set a New Password

Clicking the reset link in the email switches the modal to the new password screen.

  • Heading: “Set New Password”
  • Message: “Please enter your new password.”
  • Fill in the “New Password” field and the “Confirm Password” field.
  • Click the “Reset Password” button. While processing, it shows “Resetting…”.

Additional Information (Required for New Users)

All new users who complete social log-in or email verification for the first time must complete the Additional Information step. This step cannot be skipped, and the modal cannot be closed until it is complete.

  • Heading: “Additional Information”
  • Message: “Please enter a few more details to start using Skillnote.”

Nickname

  • Field label: Nickname * (required)
  • Placeholder: Enter your nickname.
  • Requirements: Korean or English characters only (1–10 characters)
  • Hint: “Korean or English only (1–10 characters)“

User Tag

  • Field label: User Tag * (required)
  • The prefix skillnote.io/ is fixed at the start of the input field.
  • Placeholder: Enter your user tag.
  • Requirements: English letters, numbers, and underscores (_) only (3–20 characters)
  • Hint: “English letters, numbers, and underscores (_) only (3–20 characters)”
  • Your user tag becomes your blog address (skillnote.io/your-user-tag).

Once you fill in both fields and save, you’re ready to use Skillnote.


Staying Logged In

  • Your log-in session is automatically saved in the browser.
  • When you navigate to a page that requires authentication, the log-in modal appears automatically and redirects you to the page you were trying to reach after you log in.
  • If you’re on a shared computer, make sure to log out from the profile menu at the bottom of the sidebar when you’re done.