Uğur Kellecioğlu

Asinpan

By Uğur Kellecioğlu on Apr 5, 2022
Asinpan Logo

Introduction

Asinpan.com is a web application that provides automation for searching skus on Amazon.com

I have been working on this project as an front-end developer. Even though, It is in the production, I am responsible for implementing new features, performance optimizations, bug-fix.

There is a chrome extension behind of the Asinpan. It extracts the skus from amazon automatically. I implemented it as well.

Development Process

Since, It is not a complicated app, in other words, It has simple user interfaces and product owner wanted that app to be released as quick as possible, I decided to use a template named Vuexy and decide to use server-side rendering with Nuxt JS.

  1. Releasing the project swiftly wasn’t the only reason that I choose nuxt js. You might know that server-side rendered applications have less initial load time comparing to client-side apps.

  2. SSR is perfect for SEO, that was exactly what I want. If you release an app, a service to the public, you have to somehow, grasp the peoples attention, more important, browsers.

  3. Lastly, nuxt makes the developement process easier for developers, not being concerned about configurations was a life saver for me.

The total time that product is released was 2-3 week.

Optimizations

Since I have used a template, there were tons of things that we don’t need to use. These were burden to project and made it slower.

  1. First step is always analyze the project’s weak sides. There are tons of websites to analyze it for you.
  2. After analyzing, you can draw a roadmap to optimize the page.
  3. I don’t want to get in to details, let’s see the results.
  4. I have made huge progress but there are still parts that I can improve and make the app way faster.
Performance Optimization Before After Comparison

Photos

We have an admin panel but I didn’t want to reveal that part of the app but I am glad to find an opportunity an admin panel from scratch.

  1. Landing Page
Asinpan Landing Page
  1. Home page
Asinpan Home Page
  1. Payment Page
Asinpan Payment Page
  1. Card component
Asinpan Card Component
  1. Invoice
Asinpan Invoice Page
© Copyright 2024 by Uğur Kellecioğlu.