DEV Community

Cover image for Alpha Shoes / Flatiron Bootcamp project mod3

Posted on

Alpha Shoes / Flatiron Bootcamp project mod3

Time flies

Another month passed by at Flatiron School. I was about 3 weeks ahead of the course, so I had plenty of time to study on the side. I started reading Cracking the Code Interview and C# in depth.

Monthly overview

This module we pretty much learned everything about Ruby on Rails. Generators, partials, routings, action views and nested forms, HTTP requests and so on. I must say, that RoR is definitely not my favorite framework but you can jumpstart an app pretty easily. I understand now why startups choose RoR for their stack.

On the technical side, I really like how Rails is organizing routes to keep them RESTful. Routes, action views, and controllers are closely linked together, it makes it easy for the dev to build fast and efficiently.

  resources :users, only: [:new, :create, :edit, :update] do
    resource :orders, only: [:create, :show]
    resource :cart, only: [:show, :create, :destroy]
    resource :details, only: [:new, :show]

I dislike the generators and the scaffolds a lot. It might be a swift way to create models, routes, and controllers for the MVC pattern, however, it generates so many files that are unnecessary and takes effort to collect all this garbage. I believe to focus on writing clean and DRY code is more important than speed.

The idea

I love shoes, so I decided I'm going to build an online shoe store. Designing mobile-first but also available for desktop. Rails back-end, HTML5, CSS3, ES6 JS. No JS framework was required, so I decided it could be a great way to practice DOM manipulation, fetch, and vanilla JS patterns. I use PostgreSQL as my DB.

The project:

Live Demo
Alpha Shoes

Source Code

Here is a sneak peek to the mobile version of the app:


I built the app in about 8 days, including the designing process with Adobe XD/Illustrator. I made sure I had good planning/testing and prototyping phase before I went into actually writing code.

A flowchart about my database and its associations:


A mobile layout from the designing phase:


I honestly feel like I didn't run into any major challenges while building this project, and that is probably the benefit of the detailed testing and planning. I would like to add Stripe to it as my Payment Gateway Processor so it would be 100% realistic.

Desktop Version


Future plans

I'm going to be focusing on studying a lot on the side, read books, complete a few more computer-science classes. My next project with Flatiron should have the requirement something similar to what I've built this time. As a personal project in the upcoming weeks, I'm planning on building a data visualization app about CO2 emission in the United States using D3js. Also, I promised my son that I'm going to make him a simple iPad game using C# and Unity Engine so I'm super excited about that.

I keep having to remind myself, to keep my focus on the bootcamp's stacks and requirements, but sometimes my passion for technology and software just takes over and I can't seem to able to hold my creativity and the "I want to learn everything" mindset back.

I will make a few minutes long demo video about the app, but I rather have you try it out yourself than listening to me on YouTube. Feedbacks are welcomed!

Until next time,

Top comments (3)

cosmicchimp profile image
Ian Marrs

Rock solid brother, limitless.

miku86 profile image

Great work, mate!

ianwhiscombe profile image

So good - when do you sleep?