Build any Shopping App Clone like Amazon, Flipcart By Reading this

Pravin Pawar
6 min readFeb 22, 2021

Have you ever thought of making Amazon App Clone from using real time API data? Because it’s possible of making the mostly worldwide used app Amazon in just 4 day’s…

Shocking right?

Before I start my blog writing on the clone of Tinder App, I want to thank Masai School for this great opportunity and for providing this spectacular platform where lot of enthusiastic engineers are learning and becoming the job ready skilled employee.

To be honest I never knew I’ll be able to make the app in just 4 days on the basis of what I learnt in few weeks of Masai School 12–6–6 program, But Masai made this happen.

SO let’s move to my first ever blog on How we Made UI clone of largely used Amazon App.

After second Unit of our android course Masai School team gave us a first project on shopping app’s followed by group of 3 students. My team and I was so lucky to get Amazon app :) .

So what is basically Amazon app and why people use it ?

  1. Visit the product detail page for an item you wish to buy.
  2. Tap Add to Cart.
  3. When you’ve finished adding items to your cart, tap the Shopping Cart icon.
  4. If you need to edit the items in your Cart, tap Save for later or Delete next to the item in the Cart.
GitHub Image

From where did we start project?

On the very first day of our unit Nrupul had taught us how to use GitHub(which is used for a code hosting platform for version control and collaboration). So we first made Repository on GitHub for proper flow of project and that we can push, pull and merge our individual work. Then one of us sent collaboration invitation to other group members and other cloned it inside the project folder of system using Git Bash command prompt.

As it was our first android project in group of three students we distributed our project.

Following are the steps how we created clone and what features we used inside it.

I. One of us created first tinder page and then he added , committed and pushed it on our repository.

Features used in whole projects are-

1 Linear vertical layout

2 Drawable-start inside Editext

3 Google, Facebook and chats vectors from Flat Icons.

II. Relative Layout ,TextView, ImageButtons, Intent Filters. CardView, ScrollView, Image View.

  • Resources — Strings, Styles,Colors, Dimensions, Thames, Constraint Layout, Drawable Image, Different vectors like Facebook, Google, Chat,Person, Check Box from attributes ,Different founts like callibry and other Latin fonts

III. This are the two pages

  1. First one is a Menu page
  2. Second one is a Homepage

Description : In second page I have used auto scroll images taken from API in which it is scrolling automatically.

  • Features used -
  1. Constrained layout
  2. Horizontal Scroll View
  3. Popup window for below 5 Image Buttons.
  4. Cardview
  5. MultiScrollView

IV.Mobile API Call

  1. This is the result of clicking on the image symbol from home page, on click of it api get calls and this page lands here all the data is coming from the api.
  2. Api I have used is made by myself only
  3. For this page I used
  • Features used -
  1. Linear layout
  2. CardView
  3. Recyclerview
  4. Imageview
  5. Different mobile images

V.Fashion API call

  1. On click of Fashion button from Home page this API get called and we get that gridlayout of all the available fashion products .
  2. We called a API of our own self made.
  3. We tried to make same layout of Amazon so that it will be easy to see that successful shopping clone.
  4. We also tried to use one special function like, on click of Add to card button , we can basically add the specific Item to the list.
  • Features used -
  1. Grid layout
  2. CardView
  3. Recyclerview
  4. Imageview
  5. Different Sunglasses images

VI. This is the list of Item that user have bayed by clicking on that Buy Now button and we also calculated the total amount of all the item he have.

  • Features used -
  1. Linear layout
  2. Fonts
  3. Button
  4. Imageview
  5. Shear preferences

Challenges We faced during this project construct week are ..

As we were optimized and sorted everything at the first time there were very less challenges in our project but few of them are…

  1. Few things in original tinder app those were we haven’t learnt till now are difficult to design but somehow we achieved 70–80% of accuracy.
  2. Few conflicts while merging the Git branches are the obvious part but we as a team solved those conflicts by sharing screen on ZOOM meeting and that time we all felt like “Yeeyy, We can also solve our own conflicts and we have gain that much of knowledge till now” that was really confidence building experience.
  3. One of the Challenging part was to present app in in front of guest in just 5 min so we practiced a lot for this. AND BECAUSE OF THIS WE GOT SELECTED IN TOP 6 GROUP FOR BEST PRESENTATION.

What I learnt during this construct week

How to use GitHub and how to collab with group mates.

  1. I learnt how to debug our code.
  2. How to work and communicate with a team.
  3. How to give proper naming conventions so that any person who reads a code will understand it.
  4. How to be more efficient and productive at a same time.
  5. Different attributes in android studio.

Conclusion

As it’s really challenging to make UI of the biggest shopping app Amazon but, my team and I made this happen just because our unity and continues dedication for our project and only goal of coming 1st in presentation and in a blog writing. Even though my team mates and I are from non tech background We gave our best and came out with this beautiful app.

Plus , We Did 40+ commits, Created 5 Branches, called API’s and Made 20+ layouts

I wanna ask you a last question before I sign out,

As I have learnt till now API calling and all the android related this that can be used for making simple app or clone like this, Do you think I can make the app which can be accepted by Google play-store?

Please leave comment…

Thanks for reading :)

--

--