Satoki Ito

Satoki Ito

Full-Stack Developer

profile photo

About Me

Hi, my name is Satoki.
I am a junior full-stack developer based in the UK with a passion for developing functional and well-designed applications in our ever expanding world of technology. As a recent graduate of the full-time, six-month-long Boolean UK Software Development course, I have continued to develop my skills through a range of personal projects. I always strive to improve and use my problem-solving mindset to deliver calculated solutions, continuing to hone my skills every day.

Prior to becoming a full-stack developer, I accumulated over 5 years of experience in the financial sector, having worked at both a bank and a financial advisory firm. These roles immersed me in fast-paced, dynamic environments in which I continuously challenged myself to learn and progress. This commitment to continuous growth is a value I uphold every day.

I have experience working with the following technologies (click or hover images):

My Projects

Babble - Chat App

Description

Babble is a full-stack real-time chat application. The app has a sign up and sign in function, allows a user to add friends and send instant messages which update in real time.

For this app I used the Next.js framework along with TypeScript and Tailwind CSS to help streamline the development process. I utilised the Next Auth library for the authentication which helped with the sign up and sign in function as well as to implement a Google OAuth login option for the user. Bcrypt has been used for the password hashing during sign up and sign in for security. For the database I used Redis on the Upstash platform due to the low latency which helps with the real-time aspect of an instant messenger app, and Pusher in order to implement this real-time aspect.

In regard to some of the finer details of Babble, a user initially has the option of signing up for the app using an email, name and password, or alternatively using Google OAuth. After signing in the user can add any other user on the app by searching via their email. Successfully added friends can then send instant messages to each other. Messages have timestamps and can be deleted by the user who sent them. A user can also update their name and email in their profile.

Tech Used

  • HTML
  • Tailwind CSS
  • TypeScript
  • Next.js
  • Next Auth
  • Redis
  • Pusher
  • Bcrypt
chat app sign in pagechat app dashboard page

Codeify - Spotify Clone

Description

Codeify is a full-stack Spotify clone app. What I like most about the Spotify app is the design and ease of use for the consumer. As such, I wanted to remain truthful to this design in my own approach, whilst also implementing a few subtle changes to add my own flair.

In order to achieve this I have utilised the Spotify Web API to create an app with the core functionality to allow a user to play/pause a track, skip forward/backwards and change/mute the volume. I have also implemented a search feature and the details for every artist/album/playlist can be viewed throughout the app. The user's own playlists, saved albums and liked tracks are available in the left side menu.

A particular feature of the Spotify app I like is the use of the album artwork colours to generate a gradient background. I have also implemented this feature into my own app to mix the predominant colours of an album artwork and use the result to dynamically render a gradient along with the core background colour.

For the backend I have added a sign up and login feature for added security. For this authentication I have used JWT and Bcrypt. I have also implemented a feature to record the number of times a track is played and save these stats to the database. The user can view how many times they have listened to a track in the app.

Tech Used

  • HTML
  • CSS
  • JavaScript
  • React
  • Spotify API
  • Express.js
  • PostgreSQL
  • Prisma
  • JWT
  • Bcrypt

Music Playback and Volume Controls Demo:

Further Details and Search Feature Demo:

Gymtyme - Workout App

Description

Gymtyme is a front-end workout app designed to allow the user to create workouts tailored to their own fitness goals. The user can either choose exercises from a filterable list of suggested exercises, changing the sets and reps as required, or by manually entering the details of an exercise.

The workouts can be completed once done, or deleted if no longer required. A list of completed workouts is available to the user so they have a record of previous workouts.

I wanted to create an easy to navigate app so the user can quickly find and create workouts, as well as providing a list of suggested exercises based on each muscle group. The user profile page also provides access to all these features, again for ease of use.

Tech Used

  • HTML
  • CSS
  • JavaScript
  • React

Create New Workout Demo:

App Navigation Demo:

Contact

Get in touch!