EscenApp: A webapp for artists in Puerto Rico

Kevin Ramos
6 min readMar 24, 2022

--

EscenApp Landing Page

Hello, everyone. Let’s start saying that this entire experience was crazy. So many hours spent learning new techs to get your app running felt so good.

Now, the purpose of the EscenApp is to provide to the artists in Puerto Rico a place to promote themselves. For this, we planned adding features for them to do it like adding an event. Of course, it’s not the only thing. There’s a custom registration form, login, request/reset password, update account information, change profile picture and so on. But the thing is, there’s many features that we want to add for the artist and user in the future before we can call this webapp completed.

The Team

Here is the team of devs that were behind EscenApp. Me, Kevin Ramos, as a Back-end and Yared Torres plus Sergio Vera in the Front-end. I worked everything to move the application and exchange information between the Backend and Frontend while Yared and Sergio worked everything to look good in the Frontend for the user to move around in our app.

Timeline

We had this timeline for us to focus on one task at a time. The problem with this was the lack of communication and time management. It was not until week 3 that we could start doing something. At week 2 we defined the Idea with something that was not even close to what we wanted. So at the end we could do something that works with many functionalities but everything that we wanted to be unique it was left to be done in the future. We learned a lot about this process and even if it was not close to our original MVP, it’s still something to be proud of.

To be clear, the final project versus the original purpose as it is right now, aren’t the same. The idea was to create a webapp to literally exposed all the events that happens nearby every person but we don’t know of. For example, if you’re with your friends in a bar or family eating in a restaurant without any idea what to do next, then this app is supposed to give you one. Like checking what events are nearby of artists registered in our app that can go from an exposition of a painter to a musician playing music on a street nearby. This was something that I really wanted to do too. But the end of the webapp is far to be what we thought of first and there’s still much to do.

Why I choose this project?

I’m going to be honest. I couldn’t choose. Not trying to throw dirt on anyone on my team, but the thing is it was a funny because we were three sharing ideas. Thing is I decided not to put my idea into vote. So the only ideas to vote for was Sergio (something related with education) and Yared with an webapp for artist. So Yared voted for himself, and Sergio voted for Yared. And I couldn’t do anything. But still, I was just motivated to work on Yared idea since one of my purpose as a developer is too bring solutions to any community that needs one. And is something that will always take me to do projects in the future. Just a way to help those who needs helps to grow but don’t have the resources to do it.

Architecture, techs and features

We had to update the architecture in end and it looks like this.

Final Architecture

So here’s the list of our techs used in the backend and frontend:

Back-End

  • Python: base language for all our configs, database tables, forms and endpoints.
  • Flask: for all the configurations for database, login, Blueprints and the app itself.
  • Flask SQLAlchemy: to create the models of all the tables with their attributes.
  • Supervisor: is a client/server system to get into production your app and log everything that happens while is up.
  • Nginx: is the webserver we decided to go with since is something we knew about before and the configuration was going to be easier to make.

Front-End

  • HTML5: for all endpoint templates that we need it.
  • CSS + Bootstrap: for all the styling in the front end and forms
  • Jinja2: Even if this is a in between backend and frontend it was used in the html templates and we used this because it was easy to implement and use.

A list of Features:

  • Registration Form
  • Login Form
  • Request/Reset Password
  • Update Account Info.
  • Create, Update and Delete events

We wanted to add a more unique feature but just because the timeline didn’t go as we want it we had to go with something more general but working features.

Technical Challenge

When I was making the registration form I made some tables in our database beforehand. Those tables were Artist and User. But then, one of my teammates told me that the information about genre/instruments should be static data. So that means, that the artist is going to choose between some options available. For this, I did some research and found out about Drop Query Select fields. This is a table with static data that will be shown in the registration form as a dropdown list.

Now, one of the problem I had is, because SQLAlchemy from flask is limited, I had to use something called “SQLAlchemy_binds” and what this does is give you the possibility to add another database so it will not affect anything that happens in the other tables. I divided two tables in the main database and the other two in the other one. But in the end, after everything, this wasn’t even necessary because there’s something called “select_field” in WTForm that will the you create a field with multiple options for the user to choose from and then add that choice into the table on the database. Still, learning stuff is never bad or good enough.

Learning Experience

The overall experience about this project was great. I mean, we had many setbacks in the process because of communication, time management, commitment, and so on. But in the end, I learned so much about Flask, API, Forms, hosting, ORM, and a bit of HTML, CSS, BOOTSTRAP and Jinja2. Thing is, I will take this and learn more into my next project. Oh, and how much I underestimated Flask micro framework. I really want to know so much more about it.

One of the thing I really didn’t took into account is how frustrating it is for you to be into a project so much, doing progress, while the other side is just stuck without progress. I really learned so much about how to work with that kind of situation and really be there for if they need me because in the end, we are all part of the same team. We cannot stop, and if I’ve to do the double then let’s do it. Hopefully they will do the same for me in the future.

About myself

Before the pandemic I was just an employee in a manufacturing company. Before even that, I was working in a family business with many struggles to grow. So when the pandemic hit, I really wanted to reestructure myself. I always liked technology but never tried programming. So when Holberton came, I saw a good opportunity to get into it. It was not easy, I sacrificed many things but that’s in the past now and what I want to do is still the same. Help small business, communities, give something of my own to help this world be better.

If you’re interested to know more about me you can check my different accounts that I got:

EscenApp Github Project:

https://github.com/KevinTMO/Escenapp

Deployed EscenApp + Landing Page

http://170.187.206.144/home

Linkedin

--

--