Let’s meet at “lobbi”: A kiwibot project

About lobbi

The beginning

A good team needs good stuff and lobbi was designed for being a perfect companion for those people who bring life to kiwibots behind the scenes, the kiwibot supervisors.

Supervisors like every team need a tool for managing work, time and resources and this big trouble was a challenge to solve for my team Hollow Knights, a team i’m glad to present you:

The Blitz Code project

The first steps don’t have to be baby steps and lobbi doesn’t have to be an exception, before Hollow knights arrival, lobbi roots were already there, the idea was there and someone was already building it.

Inspired by design and giving the best experiences, blitz was born as the project codename taking react as the core and material UI as the new face kiwibot needed to know

About myself i was totally agree with the strong focus on design behind blitz so i choose to be the architect of the lobbi’s face

Booting the dream

Standing doors out

Before going on this coding travel i was not aware of how big the tech industry is, how many people are engaged with innovation and becoming true to all his dreams, and among all those dreamers Kiwibot was one of those companies who wanted to change the way things were done until now.

Standing doors out I was impressed, kiwibots were not just really useful but they were pretty machines, more than concept kiwibots were designed to be part of our life, not as a service but as a mascot of the tech culture.

The Ambassador of the robotic last time

Even in my first days of this coding adventure I didn’t know the potential of the robotic industry and i’ve never imagined something like that could happen in Colombia; let’s assume it, we always have the lowest expectations compared to “big countries” but we always can change our mind.

The Ambassador of the robotic last mile was in the right place for letting me know some pieces of the future were in the robotic last mile delivery and the limits of my imagination were expanded from something pretty and cool to a new revolution in quite a lot of computer science fields such as Artificial Intelligence, Big data, robotics, algorithms and even society

Works begins, Lobbi is now in construction

The Bricks

Time is short and crafting materials are required, this is the list:

• Devias kit pro: working from zero is great but working from premade stuff is the wisest option in this tech world; material Design, React and Material Components ready to use
• ReactJS: developed for the internet, reactJS was perfect for making dynamic sites, a well supported framework with a solid community and great scalability
• ExpressJS: for the backend express has an easy learning curve, endpoint and requests management; perfect for restAPI services

The facilities

Lobbi is a experience and a experience is not complete without some cool features:

• User Accounts with role assignment: Lobbi is not just for supervisors but for administrators, the admins rule, the sups make the environment
• Calendar for managing work hours: the main feature of lobbi is the supervisor work hour management and here we have even more:

— Work Hour Drag & Drop: Calendar is not just a list, work hours can be dragged & dropped for easy edition

— Workhour Click & Create: Click the day, set the work hour, easy and funny

— Workhour resize: Create a work hour, resize the block and you will have multiple work hours with just one movement

— Workhour Color Feedback: colors are for more than appearance, work hour blocks change its color according to the limit of subscribers

— Avatar & bio: getting ready for being social, avatar & bio are the first steps for connecting people

— Multiple themes: personalize your environment according to your tastes

If it’s good it’s not easy…

Starting from zero has many disadvantages and a lot of advantages that premade projects doesn’t have, here we found the greatest challenge:

Situation

Premade project has a lot of cool features and depending on the resources, a good support and documentation but you need to learn a lot more things in order to get ready for developing

Task

The main goal is understanding how to take profit from the useful resources we have at our disposal, so our first objective is getting total clarity about all the documentation provided by the developer team.

Action

First step is getting started with technologies used in the project:

1. ReactJS: A vast JavaScript framework with great components, react is great but we, the hollow knight Team needed to study before touching the code, the first week our team member Manuel Acero did a crash React course that helped us to figure out where to begin
2. ExpressJS: great package for managing endpoints and requests, Cristian and I took express as our main goal for learning how to build the restAPI core
3. RestAPI Standards: RestAPI is designed to serve lobbi but we need to think about linking more and more services and a well structured RestAPI service is mandatory. Swagger is here to solve this, with swagger we write the documentation for the future developers and for our own sake
4. Material UI Components: lobbi project uses material design components and all the team take the role of reading the material design documentation

Result

After two weeks reading all the needed material we found the right starting point, user account database development was the first thing we thought that must be implemented and for this purpose we implement Mongo Atlas database.

About Frontend interface we choose the necessary components and those component were fully integrated with mongo database and RestApi services, API & Frontend are also independent so one of them can be changed without affecting the other one.

The end of all the experience

I could say that much of what I could learn by doing this project was to go into it without any knowledge prior to that programming language and get to understand it and know enough, since it had no knowledge of JavaScript and much less of React, which I learned in less than a month, and even though it took me a lot of work it was entertaining to learn something new every day.

I would have liked to do a project with React before starting because along the learning path I discovered things that would have improved it.

In addition to this, this work taught me how to work as a team and be organized and fulfill my weekly deliveries, and most importantly, changed my vision of how to work with a startup.

I’m very grateful to have had the opportunity to work on this project.

Una de las cosas que mas aprendí en este proyecto fue el empezar de 0 con un leguaje de programación y llegar a entenderlo bastante bien porque yo no tenia ningún conocimiento de JavaScript y mucho menos react por lo que tuve que aprendérmelo en menos de un mes, pero pues a la final fue un poco frustrante pero divertido a la hora de aprender tantas cosas nuevas.

Yo creo que lo que mas cambiara de este proyecto para que quedara mucho mejor es hacer un proyecto con react completo antes de iniciar esto porque hubiera cambiado tantas cosas pero eso no quita el aprendizaje.

Y yo diría que este proyecto me ayudo bastante a trabajar en equipo y trabajar por entregas semanales, creo que este proyecto cambio bastante mi vision de como trabajar con un startup y eh de decir que me encanto bastante y me siento muy feliz por tener esta oportunidad.

about me

I’m a very creative person that is learning all time.

GitHub: Manga08
Twitter: @MangaAcero
LinkedIn: Manuel Acero
Landing page and app page