DEV Community: Heriberto Roman

Why I Chose Django + HTMX + React for cThink

Heriberto Roman — Sat, 02 Aug 2025 19:11:51 +0000

As I’ve been building cThink, my multisensory learning platform for technical education, I’ve faced a foundational decision: what frontend stack should power the user experience?

Like many developers, I initially assumed I’d default to a full React frontend. But the deeper I got into the product’s needs, the more it became clear that a hybrid architecture — Django on the backend, HTMX for most interactions, and React only where it makes sense — was the right choice.

Let me explain why.

The Stack I Landed On

Backend: Django + Django REST Framework
Frontend: HTMX for most UI interactions (forms, buttons, partial page updates)
Frontend: React for advanced interactive components (code editor, visual builder, etc.)

This gives me the best of both worlds: the speed and simplicity of server-rendered HTML, combined with the power of client-side reactivity when needed.

HTMX + React: The Best of Both Worlds:

Here’s a breakdown of when I’m using HTMX vs React on the frontend:

By default, HTMX drives the UI, keeping things fast, lightweight, and simple. But in places where interactivity demands more — like a visual logic builder, embedded code execution, or onboarding flows — I mount a small React component into the page.

Why I Didn’t Go Full React

Speed of development – HTMX lets me ship fast, without getting bogged down in state management or boilerplate.
Less frontend overhead – No bundlers or complex build chains unless I truly need them.
Better server integration – HTMX makes Django’s built-in class-based views and templates shine.
SEO & performance – Server-rendered HTML helps with crawlability and speed, especially important for public-facing learning content.
Control – React gives me interactivity where necessary, but not at the cost of complexity everywhere else.

When React Does Make Sense

There are places in cThink where React is absolutely the better fit. For example:

A collaborative whiteboard
An interactive drawing canvas for the D.A.B. (Draw–Act–Build) model
A live chat system or embedded video session

These aren’t things I want to try hacking together with hx-get. For these, React gives me the control and dynamism I need — and I can load it only where required.

A Progressive Architecture

Rather than choose between simplicity and power, this hybrid approach lets me:

Keep 90% of my code in familiar Django views and templates
Use HTMX to handle the bulk of the user interface, AJAX-style
Introduce React only where it adds value

The result is a fast, modern, scalable platform that’s still easy to reason about — and friendly to new contributors or students who may not be full-stack React experts.

Final Thoughts

Going hybrid isn’t a compromise — it’s an optimization. By combining Django + HTMX + React, I’ve built a stack that matches the complexity of the product, rather than over-engineering for the sake of trends.

If you’re building a learning tool, internal system, or SaaS platform where most interactions are standard forms, filtering, or CRUD — give this stack a serious look. You might be surprised how far HTMX can take you.

You can find me here 👉 https://heriberto.codes

What is HTMX? Explaining this to my 8-year-old daughter.

Heriberto Roman — Mon, 09 Jun 2025 21:20:00 +0000

Preface

I decided to write this short blog about HTMX because I’m working on a side project for a client that allowed me the freedom to use any tech I desired as long as the app was fast and delivered on time. Since I am working with Django , I thought I would give HTMX a try.

While working on the project, my kids tap on my shoulder every so often and ask me questions. In this particular case, my daughter, who is actually coding at school and at home with code.org, asked me what I was working on. I told her, “ I am learning HTMX.” Then she proceeded to ask “Dad what is HTMX?” 🫠

Then I had the deer in headlights face 🦌 🔦, how do I explain this to an 8-year-old? Well, here it goes.

🧙‍♂️ What Is HTMX?

Hey there, little coder! 👋 Today we’re going to talk about a magical helper called HTMX. It’s like a superhero that helps websites do cool tricks — fast and easy!

🍪 Imagine You’re on a Website…

Let’s say you’re visiting your favorite cupcake website. You see a big button that says “Show me more cupcakes!” 🍰 Now, there are two ways the website can show you more cupcakes.

🚪 The Old Way (Without HTMX)

Without HTMX, here’s what happens you click the button…

💨 The whole website disappears!
🏃 It runs to the kitchen, gets more cupcakes,
🍽️ Then it comes back with a brand new plate.

That takes a little time. You had to leave your seat and come back — kinda slow and annoying.

🧙‍♀️ The HTMX Way

Now imagine there’s a magic waiter hiding behind the scenes. When you click “Show me more cupcakes,” the magic waiter says:

“Don’t worry! Stay right there. I’ll go grab just the cupcakes for you.” 🍰✨

No need to reload the whole page. No jumping around. Just the part you want — the cupcakes — appear like magic! 🎩

💡 So, What is HTMX?

HTMX is a tiny helper that makes websites faster and smoother. It lets buttons and links talk to the kitchen (the server) and bring back just the stuff you asked for, without making you leave the page. It’s like a magic waiter for websites. 🧙‍♂️✨

🔧 Grown-Ups Love HTMX Because

1️⃣ It’s super fast 🏎️

2️⃣ It’s easy to use 🧩

3️⃣ It makes websites feel like magic ✨

4️⃣ You don’t need tons of complicated code 🧠

👶 Final Thoughts

HTMX is like having a little helper that says: “Hey buddy, I’ve got this. You just sit back and enjoy your cupcakes.” And who doesn’t want that?

👨 👩 A little Code sample for the gown ups

Create an index.html file and add the following script tag and style code in your head tags:

<script src="https://unpkg.com/htmx.org@2.0.4"></script>
  <style>
    body { font-family: sans-serif; padding: 2rem; text-align: center; }
    .cupcake { font-size: 3rem; margin: 0.5rem; display: inline-block; }
    button { font-size: 1.2rem; padding: 0.5rem 1rem; cursor: pointer; }
  </style>

Add the code below and place it in between your body tags:

<body>
  <h1>🧁 Welcome to Cupcake Magic! 🧁</h1>
  <p>Click the button to get more cupcakes without leaving the page!</p>

  <div id="cupcake-box">
    <div class="cupcake">🧁</div>
    <div class="cupcake">🧁</div>
    <div class="cupcake">🧁</div>
  </div>

  <br><br>

  <button 
    hx-get="/more-cupcakes"
    hx-target="#cupcake-box" 
    hx-swap="beforeend">
    🍰 Show Me More Cupcakes!
  </button>
</body>

Create a separate more-cupcakes.html file:

<div class="cupcake">🧁</div>
<div class="cupcake">🧁</div>
<div class="cupcake">🧁</div>

💡 The HTMX Magic Explained button attributes breakdown

hx-get="/more-cupcakes" - "When clicked, make a GET request to this endpoint"

hx-target="#cupcake-box" - "Put the response inside this container"

hx-swap="beforeend" - "Add new content at the end, don't replace existing cupcakes"

✅ View on Github

https://heriberto-codes.github.io/HTMX_Cupcakes/

Custom Colors in Tailwind CSS v4 with Django-Tailwind

Heriberto Roman — Mon, 19 May 2025 02:23:16 +0000

If you like me scouring the web, AI Models, or Stack Overflow trying to find out how to add custom colors to Tailwind, you may have come across some articles indicating you should add a tailwind.config.js file to your project. Please Stop 🛑 !

There’s definitely been some changes, and one of them is the way we do custom colors. You don’t need a tailwind.config.js to add custom colors like you did in previous Tailwind versions. In Tailwind CSS v4, the team introduced a zero-config mode, meaning: You don’t need a tailwind.config.js file at all to start using Tailwind. It has 1st class support for CSS variables….. no more javascript config file.

I wish I would have found this out sooner. I spent two days of banging my head against the wall refactoring my tailwind.config.js file and running “python manage.py tailwind build” , “python manage.py tailwind start”, and “python manage.py runserver” over and over, hoping the coding gods would change my background color 😢. To give you some context about the project, here it is.

I’m currently working on building a new web-app for a Telehealth therapy service called Empowered Path Therapy. I’m building a new front end with Django DTL, Django-Cotton for building components, and a backend with a CMS with Wagtail. Now, this is my first time using Tailwind. Yes, I know I am late to the party. I am a creature of habit. BOOTSTRAP!!

After installing Tailwind for the first time using the python django-tailwind 4.0.1 package, I ran into a roadblock. I didn’t see a tailwind.config.js file that all of my AI models suggested I implement in my project. My mistake from the beginning was trying to create a tailwind.config.js file manually and add my custom colors in it, but this did not work. Nor was it necessary.

How to add Custom Colors

When using the django-tailwind package, which makes it easy to integrate Tailwind CSS into Django projects using PostCSS and the Tailwind CLI, all within Django’s existing staticfiles workflow, a theme folder gets created in the root of your directory. If you dive into the theme folder, you will find:

theme/ ├── __pycache__/ ├── static/ │ └── css/ │ └── dist/ ├── static_src/ │ ├── node_modules/ │ ├── src/ │ │ └── styles.css │ ├── .gitignore │ ├── package-lock.json │ ├── package.json │ └── postcss.config.js

Find the static_src folder -> src -> and dive into the styles.css file. This is where you can create your custom colors via CSS variables. Like so:

Assuming you have a Django properly set up and Tailwind installed, open your terminal and run these commands: python manage.py tailwind build, python manage.py tailwind start, and in a new terminal window, python manage.py runserver.

Here is what my Django template looks like:

And here is the result on my dev server:

I hope this helps someone out there who was stuck like me 👍

You can learn about me here https://heriberto.codes/ or follow me on x or YouTube. FYI, I’m always looking for new projects to work on. Hit me up!

From Sales to Learning How to Code to Developer……Well Almost (Part 4)

Heriberto Roman — Fri, 10 Jan 2025 21:56:57 +0000

<< Part 3

Youtube 📹

After transitioning out of The Knowledge House, I began building my YouTube recording studio to prepare for my first video, which I titled Hello World. My goal was to create a series of videos documenting my journey — applying to jobs, live coding, and live learning. Through these videos, I aimed to showcase my progress and skill set to potential employers, turning my YouTube channel into a dynamic online resume. Public views weren’t my focus; instead, I wanted to reach the right people — those who could see my potential and value.

After publishing my first video, which did OK 😄, I discovered my niche: creating videos about solving coding challenges. The timing aligned perfectly with my interview preparation, as coding challenges, data structures, and algorithms were areas I needed to strengthen. I made the strategic decision to document my journey, recording both independent and collaborative problem-solving sessions.

This endeavor proved to be an invaluable learning experience. It challenged me to expand beyond my comfort zone and develop a deeper understanding of fundamental problem-solving patterns, including:

Frequency Counters
Multiple Pointers
Sliding Window
Divide and Conquer / Binary Search
Depth-First Search (DFS) and Breadth-First Search (BFS)

One of the coolest parts was how it forced me to expand my network. I started cold messaging developers on LinkedIn, asking if they’d pair program with me on camera to solve coding challenges. To my surprise, some awesome devs agreed, and we created some great content together.

Then something unexpected happened. I reached out to this one developer Raul Gil about pairing, and while he declined, we ended up having this deep conversation about how broken the hiring process is for developers. We kept in touch, and ironically, something even better than a pairing session came from that connection.

My First Role as a Software Engineer 🥳

So check this out — Raul Gil reached out to me about a SWE position at Tiny Organics, this awesome e-commerce company that makes organic baby and toddler food! He had just landed the Director of Engineering role there and thought I’d be a perfect fit for the team. After going through two rounds of interviews, I got the official offer — I literally couldn’t believe it! 🤯

After all the grinding, late nights coding, and pushing myself to grow, I finally hit my goal: getting paid to do what I absolutely love. Talk about a dream come true!

I spent a full year at Tiny Organics, and let me tell you what I got to build 🛠️I helped with the creation of this really cool subscription pausing system using the Finite State Machine model with Django-FSM for our location-based recipe feature. This was huge because it gave our 15K customers way more control over their orders — they could pause and adjust things exactly how they needed, which meant less wasted food and more money saved.

Then I built this microservice (basically a webhook) that let users unsubscribe from products through the Recharge/Shopify API. Had to get my hands dirty with Ngrok, Docker, Express, and Node.js for that one.

One of my favorite projects was revamping our company pages using Wagtail (it’s this awesome open-source Django/Python CMS). Made it super easy for our team to manage all our content at scale.

It was an incredible experience where I learned and grew so much… but you know how it goes — all good things must come to an end. The company was feeling the squeeze — sales were down, and with those federal interest rates climbing, Tiny Organics’ investors started pulling back. The engineering team took the hit and we were let go. Super disappointing, not gonna lie 😕, but hey — that’s sometimes the cost of doing business in the startup world.

Launching Hroman Codes LLC — My Freelance Dev Journey 🚀

So after being let go, I took some time to reinvent my brand from BuiltByGetroman to Hroman codes — and to make it more official, I started my own LLC! Hroman Codes LLC 🎊. It was a big move for me and something I always wanted to do, even before college. Since starting my LLC, I’ve been able to lock down contracts with startup companies like The Seeker, Change Food for Good, Rubix AI, and Empowered Path Therapy, where I helped with Web Development, Software Engineering, and consultancy.

Leveraging my multifaceted experience in sales, startup operations, and software engineering, I embraced diverse responsibilities — from client acquisition and relationship building to intensive software development. This entrepreneurial venture proved to be the most fulfilling work I’ve undertaken independently. Now, I’m embarking on my most ambitious initiative to date: developing a proprietary SaaS solution under my LLC.

As my former engineering director Raul Gil once told me: “The time of depending on an employer is over. At this stage, you should build something that people in your local community and beyond can use.”

The Product - CThink

CThink was conceptualized in 2018 during my tenure at The Knowledge House, as mentioned in my previous blog “From Sales to Learning How to Code to Developer… Well Almost (Part 3).” Now I want to take it a step further and turn it into a SaaS product that I can share with the education community. CThink is not just a tool to learn how to code — it’s about learning how to break big problems into smaller, more digestible pieces of understanding.

The DNA of CThink was derived from a pedagogy I created called ✏️ Draw, 🎭 Act, 🔧 Build (D.A.B). It’s a simple 3-step process that accounts for all three learning types — Visual, Auditory, and Kinesthetic — while learning a new coding concept (or really, any concept). You can either follow all three steps in order or pick the one that works best for you.

Here’s how it works: The ✏️ Draw step is where you map out a visual representation of the concept you want to learn. The 🎭 Act step involves role-playing, speaking out loud, or watching videos about the concept you’re trying to internalize. Finally, the 🔧 Build step is where you physically apply the concept, either through actual code or some form of code abstraction.

When you combine all three steps, you essentially create your own analogy — your personal definition of the coding concept you’re trying to learn. This makes it much more likely that the idea will move from short-term to long-term memory because you’ve created a lasting, personal experience in your mind.

This approach aligns perfectly with the Decomposition step in the computational thinking model.

Since starting my programming journey back in 2014, I’ve been immersed in the tech space and have particularly enjoyed working in education across public, private, and nonprofit sectors. These experiences shaped me into a great Software Engineer and Technical Instructor. Now, I want to take all these experiences and create a product that helps people understand their learning styles and provide them the tools they need to get over the learning hump. Currently, CThink is in the prototype phase, and if you want to learn more, you can follow the timeline here.

What happens next?

It’s no secret that the tech job market is in rough shape. It’s one of the reasons why I slowed down on applying for work and started creating solutions for customers instead. I couldn’t bear one more rejection from an employer after applying to over 10k jobs in the past four years with zero offers (yes, I documented everything). Don’t get me wrong — I’ll continue to apply for tech jobs while I work on my SaaS product since I still need to pay the bills, but this time I’ll have another project under my belt and more experience to offer alongside my LLC.

So for all of you struggling out there, I want to take the time to let everyone know that you are not alone and shouldn’t give up 🙏. This coding journey is a marathon 👴, not a sprint 🏃. If you find yourself stuck, then go build a solution for it and promote it… start your own business if you need to. One day it will all pay off — Success is built on an endless cycle of learning and growing from our failures.

Thank you for taking the time to read all 4 blog posts. I’m grateful for all my opportunities and excited to see what lies ahead. You can connect with me here:

<< Part 3

From Sales to Learning How to Code to Developer……Well Almost (Part 3)

Heriberto Roman — Wed, 10 Mar 2021 00:10:16 +0000

<< Part Two

Volunteering @ The Knowledge House

Fast forward three months, I finally heard back from TKH regarding their volunteer opportunities. After a two-hour phone call with Stephany Garcia a team member from TKH, it was mutually agreed that I would be an asset to their mission. TKH’s mission is to build up the Bronx, which is the poorest congressional district in the United States by providing technical training and professional development expertise to develop talent in youth and young adults. I thought it would be an excellent opportunity to test my hard and soft skills while mentoring some folks from the same neighborhood I grew up in 💪.

Eventually, I was invited to the TKH office at Hunts Point, which was a few minutes away from my house. I was introduced to the staff members, and immediately I knew this experience was going to be different, why?
Because in most tech settings interacting with other black and brown tech enthusiasts was not a common occurrence. Sadly.

So it warmed my heart to run into an organization that tackled the lack of diversity in tech. I knew my volunteer experience was going to exceed my expectations, and I was f&%#ing excited!

My volunteer timeline was scoped to 3 months of work that involved tech & career mock interviews, guest speaker appearances, curriculum review, and technical review. I worked with over 20 students in the process and built some lasting relationships with students I still communicate with today. It was some of the most gratifying work I have accomplished in a long time. The best part was the ability to flex some of my new dev skills or lack thereof 😬. Either way, tech opportunities and mentorship in the Bronx were hard to come by, and I knew the students appreciated the TLC so it was worth it.

Fast forward some months, my volunteer time was almost up, and I was ecstatic about my accomplishment. TKH must have felt the same because they surprised me by hiring me!

Holy Crap! I landed a new job at The Knowledge House as a Full-Time Instructor no offense to some of my security peeps but peace ✌️. It was about that time to fully get back into my career path and work my way into the tech scene again.

I was ecstatic about the new role, I attributed it to the long coding nights, my volunteer time, and the passion I showed for TKH’s mission statement. I believe that TKH saw the value in me, and in response, I was rewarded with a paid opportunity. How about that! 😄

Teaching is Learning Twice 📚 Newly Hired Instructor 😁.

My first assignment as an Instructor for TKH was at the Fordham Step Summer High School Program, located in Fordham University Lincoln Center. I was responsible for instructing the Exploring Tech Program, which supported students with learning modules in hardware, software, project managing, and MVP building with the lean canvas model.

It was definitely a challenge to mold young minds to think computationally. In the end, my students ended up building small MVP that solved a specific problem in their communities. The MVP requirements included identifying a problem, a solution, and building a unique value proposition. Their demo was in the form of a live interactive website that was created using modern web development tools like HTML, CSS, and Javascript. All of this happened in 8 weeks 😅. It was intense but a lot of fun.

NYC TTP / Bridge To Tech Program - TA

After a year at the Fordham Step Program, an opportunity was presented to work with young adults in a relatively new program called the NYC Tech Talent Pipeline (TTP). Managed by the NYC Department of Small Business Services (SBS), TTP is designed to support the inclusive growth of the NYC tech sector. It was a step up in difficulty in regards to teaching code newbies but I was intrigued, so I dove in and accepted the new role.

Our 12-week program was called Bridge To Tech and it was designed to support low-income underrepresented tech enthusiasts with an opportunity to learn modern web development. The program outcome was a shot at attending NYC premier coding Bootcamp Fullstack Academy for FREE!

I took on the role under the wing of my Lead Instructor and Coding Mentor Tremaine Davis. I assisted Tremaine in the capacity of a Teaching Assistant for the first couple of cohorts of the Bridge To Tech Program. Our goal was to scale up non-technical, un-employed young adults to well-rounded code newbies. We covered HTML, CSS, and the fundamentals of Javascript in addition to version control with Git and Github. We codded our buts off, ate cherry pie, and had a lot of tough learning moments.

This is going to sound cheesy but I remember the best part of the day was the long walks back to our car over the Washington Bridge off 181st street in Washington Heights with Tremaine, Andre Mack, and myself. We had lengthy conversations about the student's progress, how to better improve the class, and all the funny moments in between. Rain, sleet, and snow we took that walk every day. Good times.

At the end of the day, we graduated multiple cohorts with a fun Demo Day attached to the end of the program that included demo time for their MVP web applications and a certificate of completion. Special shout out to Andre Mack program manager who coordinated all the Final Demo Days and Cris Mercado Head of Career Success for keeping our students in line with career strategies and implementation.

Shortly after the cohort ended Tremaine moved on to a Front End Role at a health tech company called Quio 🥳🥂. The learning experience under this man was invaluable, seeing him work the room with his technical experience and dry-ass jokes 😂 made everyone’s coding experience that much better. Thanks, Tre for always believing in me and allowing me to be your TA and rock the classroom.

The departure of Tremaine left a huge hole to fill in the classroom and naturally, an opportunity opened up to lead the Bridge To Tech Program. I was asked to fill those shoes, it was time to step up the plate ⚾.

NYC TTP / Bridge To Tech Program - Lead Instructor
So it was my time to take what we built in the past year and level up. Throughout my time as a TA, I was able to keep a pulse of what needed to change about the program in order to best meet the outcomes we set forth, which was to push as many underserved students into the Fullstack Academy Immersive Bootcamp.

To set the tone, there was a lot of pressure coming from the Tech Talent Pipeline and The Knowledge House to make sure 15 students passed the Fullstack Academy technical assessment. The Knowledge House at the time was at a crossroads with how they did business to sustain funding as a non-profit organization and TTP wanted the number of acceptance to increase into Fullstack Academy 🥵.

Literally, the existence of TKH as we knew it at the time rested on my first cohort as lead instructor of the Bridge To Tech program. I needed to hit a home run with this cohort and meet the magic number of 15 accepted code newbies into the Fullstack Academy Bootcamp 😲. With the support of Andre Mack and other key players, we had the DNA to succeed.

My first order of business was to revamp the curriculum which was 90% web dev focused. I needed to make practical changes to meet our expected goals for the new cohort. So with that, I took a more holistic approach and changed the curriculum to be more focused on the following key areas:

Communication
Problem-solving
The learning pyramid

Notice how I didn't mention anything about code 🤔
In the initial stages of the cohort coding was the least important part of the curriculum. In my opinion, coding is like a paintbrush, a tool you use to scoop up paint and slap on a canvas. It doesn't really matter if you have a state-of-the-art paintbrush or a hand-me-down brush because they both accomplish the same thing. The real work comes in the creation of concepts in your mind that decides what and how you are going to utilize the paintbrush to tell a story.

Code is really no different. Syntax comes in all types of flavors and the IDE selections are endless but one this is for certain you can use both to write either sophisticated programs or shitty spaghetti code. At the end of the day, there is one constant in both examples, we all have our own process of how we internalize new concepts in our heads and implement them in our daily workflow.

This was one of the key problems I identified during my TA days. The hardest thing to do especially in tech is teaching a mind that is not familiar with code or an abstract concept like binary 1n’s and 0’s and contextualize it in a way that makes sense to them.

My solution to this issue was a new pedagogy I created called ✏️ Draw, 🎭 Act, 🔧 Build (D.A.B) for short, a simple 3 step process to account for the 3 different learning types Visual, Auditory, Kinesthetic while consuming a new concept. All you had to do is apply the 3 steps either in sequential order or pick one out of the 3 à la carte and apply it.

For example, the ✏️ Draw step is used to map out a visual drawing of the concept you intend to learn, the 🎭 Acting step could be used to role-play, speak out loud or watch a video of the concept you are trying to internalize, finally, the 🔧 Build step could be used to physically apply the concept you are trying to learn either through code or some abstraction of code.

When you combine all 3 steps essentially you have something very close to your own analogy, your own definition of the coding concept you intended to learn. As a result, moving that idea from short-term to long-term memory is more realistic because you created an experience for yourself that is everlasting in your mind.

With that idea in mind, I supplemented a lot of the curriculum with the D.A.B pedagogy in mind and implemented workshops that allowed time to build analogies for coding concepts. Some examples are coding games, musical chairs to learn loops, youtube videos, technical demos, coding workstations, puzzles for the increase of problem-solving skills, coding challenges, communication games, legos to learn about version control, code.org Blockly API as an abstraction of actual syntax alongside other activities. All of these activities covered at least one part of the learning type and cover the ground of the learning pyramid.

The ultimate goal was to change the traditional way of teaching which was a one-to-many relationship and swap it for many to many relationship model. The construct of the class was set up in a way where the students are able to identify their learning style early on and ultimately feel comfortable enough to stand up in front of the class and become their own version of an instructor and teach others. That's where the real learning happened.

“Tell me, and I will forget. Teach me, and I will remember. Involve me, and I will learn.”

My teaching model paved the way for two successful cohorts that resulted in meeting our golden number of 15 students to pass the Technical Fullstack Academy assessment. I was so moved and inspired by my students after this experience that I started a product development sprint with the intent to build a web application dubbed cThink which focuses on utilizing the D.A.B pedagogy and building analogies to help internalize coding concepts. It is still a working progress but you can hit up the repository to follow the code.

https://github.com/getromandev/cThink

After a successful run 🏃‍♂ I part ways with TKH ✌️

After the success of the Bridge to Tech program unfortunately it was time to move on. In the past 3 years I spent at TKH I was able to successfully create & manage a technical curriculum that has served 400+ participants aged 17–70, contributing to TKH’s increase in the operational budget from $700k to $2MM, manage up to 10 TA/Instructors each cycle to facilitate classes, coding projects and execute on exceeding TKH’s 80% technical competency KPI, successfully instructed TKH’s flagship Bridge to Tech program by implementing new coding strategies and pedagogy that increased placement to NYC premier coding Bootcamp Fullstack Academy by 10x, successfully instructed TKH pilot advanced Javascript course with libraries like React, Redux, and React-Native that increased internship placements by 3X 🏅, and successfully secure my AWS Certified Cloud Practitioner Certification ☁️.

The next step in my journey 📈 🎯

Once again I found myself one step closer to my goal of securing my first Software Engineering role. Similar to Tremaine I was heading in that direction however, unlike Tremaine I had no leads or jobs lined up. So I did what any other self-taught dev would do during a Covid-19 pandemic….. collect unemployment 💰😂 😂.

No seriously, I started to think really hard about who I was as an Engineer. I wanted to leave a mark that would inspire other black and brown tech enthusiasts to also reach their goals in tech but at the same time be clear about the rough road ahead.

What kind of legacy will I leave behind? And it finally hit me! 🤔

I was going to start building my brand on Youtube ⏯ ️and document my journey to becoming a Software Engineer while starting my official job search 👔.

I knew it was going to be a difficult road ahead as a non-traditional self-taught engineer but I felt more ready than ever to take on the next battle. So here we go….. the job search begins, may the force be with me ✋.

Part 4 >>

Visiting a Three-Year-Old Unfinished React Project

Heriberto Roman — Tue, 09 Mar 2021 22:26:00 +0000

How did I get here?

Well, that’s a long story, but need not worry, I will save that for another post I wrote From Sales to Learning How to Code to Developer… Well Almost.

I’m here to talk about my attempt to finish a three-year-old unfinished React project called Highlander, a simple app for coaches to manage their team’s stats, trash talk, and poach players from other organizations. This post will probably end up being a series of blog posts, so follow me, and leave me your suggestions/comments I would love to hear your feedback.

When I first started to think about this project, it was during my coding Bootcamp days at Thinkful. To give you some more context, I was still relatively new to programming, held only one Web Dev/Design Internship at PicSpotr, and deployed a version of Highlander in HTML, CSS, jQuery, and PostgreSQL.

The task at hand was to complete a Capstone Project that required me to build a Fullstack Application with React. So I decided to take Highlander V0 and build a V1 in React. I was well on my way, and about 80% done with the project. However, I cut the project short due to a new gig I secured as a Technical Instructor at a non-profit called The Knowledge House.

Fast forward three years in a Corona Virus world. Like many others, I felt the wrath of unemployment. With new time on hand, I found myself re-visiting old unfinished projects with the intent of completion, Highlander being the first.

So I set out a plan, and after fumbling around for a day or two, I quickly realized I didn’t have a dam plan. I had to figure out how I was going to dip my toes into an older code base that I haven’t seen or touched in over three years.

So here we go, my initial thoughts on how I plan to tackle Highlander.

Go Back, 📓Read, and 🤔Understand the 🖥️Code to the Best of Your Abilities

There is a lot of value in reading the instructions when building your favorite IKEA set.

BUY the IKEA set

READ the instructions

BUILD step by step

I overlooked these crucial steps in the past many times and found myself in IKEA nuts and bolts hell. The same can happen when working with older codebases that contain many pieces to a puzzle. One possible strategy to avoid this brings me to my next step.

🗺️Map out the Architecture on Paper

I’m a visual and kinesthetic learner. Whenever I find my self trying to organize all of my thoughts and assumptions in my head, I end up drawing it out, helping with my long term memory.

After reviewing the codebase and hopefully understanding the flow, I plan to map out the architecture on paper. Initially, I plan to connect a few boxes, circles, and lines to each other, depicting the flow of the application in a visual format. And with more time and understanding of the codebase, I believe my architectural diagram will mature with much needed specific detailed drawings and annotations.

Next.

NPM start my Project and use the Errors as a Starting Point.

By now, I should have a decent comprehension of the overall direction of the codebase. Now I need to get my hands dirty and start plugging away at some code. But first, what kind of bugs am I inheriting from three years of dusty code, deprecated NPM modules, security issues, and overall architectural modifications to the React library. My anxiety is kicking in 😬😬😬.

But I need to start somewhere, and what better place to start than the line the code that broke the project.

Lastly.

Code. Visit Architecture. Read Documentation. Fix Errors. Repeat.

Basically, at this point, its rinse and repeat. As I work through the project I’ll be sure to document and write about my journey on both a technical and process level.

Let’s get to work 💪💪💪.

AWS re:Invent 2019 & The Call To Action

Heriberto Roman — Tue, 09 Mar 2021 22:24:11 +0000

Its been a few years since the Amazon Web Services (AWS) #Reinvent #awsreinvent 2019 and reflecting back I must say I was very fortunate to be one recipient of the Inaugural We Power Tech grant that allowed me to attend this conference.

FACT: Out of 700 applicants, 102 grantees from 16 countries were selected to spend a week at the world’s largest cloud computing conference @ Las Vegas!! Grantees received a full conference grant including coverage of conference fees, hotels, flights, and most food and transportation expenses.

Super shout-out to the folks at Project Alloy and #WePowerTech, and AWS. Your team efforts and super attention to detail were prevalent throughout the conference.

For those that don’t know, We Power Tech is a grant aimed at promoting diversity, inclusion, and accessibility in technology by supporting underrepresented minorities.

As Lead Technical Instructor @the Knowledge House in the South Bronx, I currently instruct TKH’s flagship Bridge to Tech program in partnership with NYC’s Small Business Services, Tech Talent Pipeline Initiative, a contributor to the efforts in increasing Diversity and Inclusion in the NYC Tech scene. My students are also very fortunate to be a part of this Bridge To Tech Cohort which leads to a tuition-free ride to Fullstack Academy, NYC premier coding Bootcamp. Because it’s such a unique opportunity I constantly preach to my students why it’s so important to stay the course regardless of any trials or tribulations they may face.

It’s so easy to give up in the Tech world because of barriers like lack of diversity, imposter syndrome, socio-economical issues, or just the simple fact of how difficult it is to learn Tech. It wasn’t too long that I almost fell out of the Tech community due to some of these attributes. It was the special community I found @ TKH, meeting other black and brown Tech enthusiasts, diversity events and pure laser focus on my goals that allowed me to see the bigger picture and fight for diversity in tech that eventually kept me in the game.

It’s obvious how vital and important partnerships like Project Alloy, WePowerTech, and AWS is to Black & Brown Tech enthusiasts. The opportunity to attend such a massive conference with over 60k attendees from all over the world (mostly non-Black & Brown) and still have the ability to sit side by side with a pocket of people that look and talk like you is essential to one’s confidence, gusto, and perseverance to keep pushing the diversity and inclusion efforts forward.

However, there is still a lot of work to do in order to close this massive gap. We have to dig a little deeper on a grassroots level and it starts with how we are educating and mentoring our aspiring tech enthusiast. Let's make sure that all tech hardware, education, and opportunities like We Power Tech and other local tech grants are accessible to disconnected communities. We have smart people out there who just don't get a fair shot, LETS CHANGE THAT!

I will continue to do my part as an Educator and Dev in the South Bronx, I ask of my friends and for those reading this for the first time, if you are part of the tech community and clueless about organizations like Project Alloy/We Power Tech or the lack of diversity in tech here is MY CALL TO ACTION:

Contribute your time in the form of tech or career mentorship (3-month minimum)
Volunteer hours at a non-profit tech ed company that serves underserved communities (120 hours minimum)
Simply make small donations ($50 minimum)

The mentorship time spent with disconnected youth and young adults who aspire to be in Tech is invaluable. Students visually seeing volunteers come in to help just changes the atmosphere completely and show that people care. If we multiply small donations 10x it could easily equal one big donation that would allow students access to a computer who couldn't afford it or even better attend an awesome conference like AWS re:Invent that could change the trajectory of that person's life.

If you want to donate to Project Alloy, go here: https://lnkd.in/dA7AcNq

If you would like to volunteer/donate to The Knowledge House, go here: https://www.theknowledgehouse.org/

So thank you Project Alloy and WePowerTech for this opportunity to:

Network with people like Antonius Prader, Aly Martin, Elijah G, Harvard Young, Irvin Aguilar-Aragon, Rosa Otieno
Attend workshops, diversity talks, and parties with some of my colleagues Cris Mercado, Elvis Garcia
Allowing me to experience the optics needed to come back to my students in NYC with a whole new perspective about diversity inclusion in Tech.
Giving me the vibes and energy to stay the course and continue to give back to my community and most importantly share my story.
Whoop some candy-ass (the Rocks voice) in an epic Dodge Ball game @re:Play
And lastly take my AWS Certified Cloud Practitioner Exam in Vegas @ AWS re:Invent 2019 and PASS!!!!

THE SWAG WAS REAL! =)

If you would like to contact me feel free to reach me via Link Tree https://linktr.ee/getroman_dev

One last thing:
Did you like this article? It’ll help me if you show your love by hitting that ♥️. (You’ll see the little icon on the left. You can clap up to 50 times, so go for it!). Clapping helps the article spread so that more people can read it. And it helps inform my writing. Thanks!

From Sales to Learning How to Code to Developer……Well Almost (Part 2)

Heriberto Roman — Sun, 31 May 2020 02:41:52 +0000

<< Part One

The Bootcamp 🥾🏕️

Shortly after the A100 program, we packed up our things and moved back to NYC, our old stomping grounds, to seek other opportunities. So here I was in NYC, taking another big leap towards achieving my goal to become a Software Engineer. I applied for a Coding Bootcamp called Thinkful, a remote Bootcamp based out of Dumbo Brooklyn, and it was exciting. It was at a time when Coding Bootcamps was a super hot alternative to traditional education. The biggest decision for me was not if I wanted to go, because I did, it was more about "Do I want to spend another 14k towards student loans " 🤔.

During that time, it wasn't easy to find financial support for coding Bootcamps. So in my mind, it was a sacrifice I was willing to take in hopes for a better chance of becoming a Software Engineer. Once accepted, I was paired with a coding mentor named Alvin Kato, a Developer from Uganda (best part of the Bootcamp), and went through the Pre-Bootcamp training. Thank you, Alvin.

After the Pre-Bootcamp training, I was accepted into the six-month Remote Immersive Engineering Bootcamp and paired with my second coding mentor Wences Negrete, thank you Wences for all of your help. The curriculum called for Client-Side Development with HTML, CSS, Javascript, jQuery, and React. In addition to Server-Side Development with NodeJS, Express, SQL, and MongoDB.

Fast-forward 5 months into the Coding Bootcamp I experienced so many long nights both frustrating and rewarding, the work was not easy. You go into things thinking you know a thing or two about computers, but trying to write Code has a great way of showing how little you know. It's part of the game.

In the short span of five months, I built a few apps, solved a few coding challenges, and incorporated project management techniques like Agile Software Development in my workflow. I was even lucky to meet a few devs from my cohort like Kevin Lee and Jamie Davella at a local meetup at Tumblr for a meetup. It was such an exciting feeling to make it this far with cool projects under my belt.

There was one project that stood out the most up to this point, and I was so proud of it. With the help of my mentor Wences and my experience with sports, I was able to build a Full Stack Application called Highlander. A simple app for coaches to manage their team's stats, trash talk, and poach players from other organizations. It was gratifying to take an idea to MVP and deploy it for the whole world to see. Momentum was on my side.

The end of the Coding Bootcamp was near, and our Instructor just introduced the Capstone Project requirements. The specifications required us to build a Modern Fullstack application using React/Redux. Ultimately I decided to take Highlander to the next level and refactor it from jQuery to React. It was a huge learning curve for me, but I made a lot of progress, and I was about 80% done with the React version of Highlander with only a few weeks from the final demo day.

My Coding Bootcamp Days Are Numbered 💻 🥺. Time To Hustle.

However, my Bootcamp days were numbered, and the development of Highlander stopped right in its tracks. My wife ️had given birth to our new beautiful daughter Lia who just recently turned three years old 👨‍👩‍👧‍👦 🎉.

So life took over, what are you going to do? I had no time to feel anything but joy for our new daughter and anxiety about not having any employment opportunities lined up to support our new baby girl. With only a few weeks away from the final demo day, I went out and found an overnight job as a security officer supervisor at Con-Edison. It was a very chill position, but the schedule sucked. The idea was to do all of my coding during the day, take care of the kids in the afternoon while my wife did her thing, and then go to work overnight.

I was determined about making it work, but you get your self into situations thinking you know a thing or two about multi-tasking, but life has a great way of showing how little you know 🤕. It's part of the game.

After the second week, I was struggling to keep up and wasn't able to get much sleep. I was burnt out. Unfortunately, I stopped attending Thinkful and pumped the brakes on the Highlander project. With the support of my wife, more focus was put on raising our son and daughter while securing some financial stability. It was a tough but necessary decision to put my career on pause to make sure our family was supported.

However, after working as an overnight security officer for about six months, I was able to change my shift to a day shift. Finally, I was allowed to work a regular schedule that would allocate me time to plan my next move. The shift allowed me some capacity to get back into programming, attend a few meetups, and get back on the path to secure a dev role ultimately.

Back in Action. The Meetup Scene 🌃

Boy, was I excited!! CodeNewbie hosted the first meetup I attended from my hiatus at a digital agency in NYC called PostLight. It was such a fantastic meetup simply because I was able to share the space with cool people like the founder of CodeNewbie Saron Yitbarek. Throughout the event, everyone I spoke with was empathetic to some of my concerns with imposter syndrome, family obligations, and time management roadblocks.

The best part of the meetup was listening to lightning talks about the current state of tech, codenewbie blues, and success stories about becoming a dev. Those talks injected much-needed inspiration to get me back into the groove of problem-solving and coding. Looking back, I ended up winning a scholarship to attend the first CodeNewbie conference called Codeland because of that meetup, so dope! Shout out to Saron and the CodeNewbie community!

I went ahead and attended a few more meetups at sites like Codecademy, MongoDB, Meteor.js, and Manhattan.js, all of which provided me with great strategies in both my hard and soft skills. But after some time, I was curious as to why I had to go all the way downtown Manhattan, Brooklyn, or Queens to attend a tech meetup?

So I ended up searching for local meetups in the Bronx, and to my surprise, there weren't many options available in comparison to other boroughs in NYC. It was a little disappointing at first, but I decided to push forward and give this meetup I found at the BXL Business Incubator located in the Banknote Building in Hunts Point, South Bronx, a chance.

I went to the location, and to my surprise, I was the only one at the event, not a soul in sight. I later found out that the organizer of the meetup never got around to canceling the event, which sucked, but I didn't leave empty-handed. Since the meetup was at the incubator, what better place to snoop… cough… cough.. I mean, look around at the building directory to see what other types of companies were stationed at the incubator. Out of the whole list, there was one company that stood out called The Knowledge House.

It sounded like a cool name, and I was curious, so I checked out the website. I read the about us page, and it appeared to be a Tech Educational non-profit company. I noticed a call to action for volunteers ad on the top of the fold of the website I immediately thought hey, why not? It's possible to volunteer at this place. I could pick up a few skills and give back to the community at the same time, a win-win 👍.

So I reached out and applied to become a volunteer.

Part Three >>

From Sales to Learning How to Code to Developer……Well Almost (Part 1)

Heriberto Roman — Mon, 25 May 2020 05:05:44 +0000

Part Two >>

My name is Heriberto Roman, I am 34 years young and working towards being a Software Engineer. I was born in the Bronx and grew up in East Harlem “El Barrio” for most of my life. There was a small stint living downtown on 72nd street when my pops was a super at 253 West End Avenue, I also worked as a Doorman and Porter in that same building.

I ended up going to elementary school in East Harlem and then attended Smith HS in the boogie down South Bronx. Fast forward to my college years, I jumped around from school to school. Katherine Gibbs (briefly studied computer science), Lehman College, University of Bridgeport then eventually graduated from Eastern Connecticut State University (ECSU) with a Bachelor's degree in Communications.

It was during my freshman year at ECSU when I was involved with student organizations that my awareness of bureaucracy in the higher education system increased. This point was an important piece of my journey, where my environment at the time drove me to learn how to sell myself amongst a sea of professionals and other motivated students. As a result, I met my mentor, Walter Diaz who later became my employer at a startup company: LatinosinHigherEd.com

The First Startup, The First of Everything

Starting off at LatinosinHigherEd as an intern was a unique experience. My first day on the job was at a tradeshow at the NASPA conference in Florida, Talk about coming in with a bang!! I had no freaking idea what I was doing (sounds familiar my fellow developers?), I was responsible for promoting the job board to recruiters looking to hire Latino/a Faculty, Staff or Administrative candidates. You would assume that given the amount of anxiety and stress, one would go into a panic mode. I didn't panic, actually, I flourished-under pressure.

Why? because I took some time out to research attendees in the conference who were key role players and who I thought was imperative to network. I literally had 5 pages of documentation stuck up on the back of our tradeshow display with scripts, rebuttals and a Linkedin profile for each person

After a few years of attending conferences like NASPA I started to involve myself in other ways I could contribute to LatinosinHigherEd. Going from intern to VP at a startup sounds like a big deal but it really was just a title change, it didn't change much in terms of the day to day role. It just meant that I had a bigger voice in the direction of the startup.

Given the competitive nature of running a job board I started to figure out ways we could enhance LatinosinHigherEd.com. Then I quickly figured out how expensive adding functionality to a website could become. That's where my interest in coding was rekindled from my previous days at the Katherine Gibbs School.

Working with clients provided me with customer validation and understanding of what the site was lacking. So I took a long hard look at the site at the time and started to build wireframes that addressed some of the client's concerns. From that point on, it was only felt natural to get back into learning how to code, so my good friend Milton Jackson former developer at ESPN and lead developer at LiHE allowed me access to the site via FTP and then I started to play with the front end of the site during "off hours" via Dreamweaver.

The AHAA Moment! The Coding Journey Begins

During my position as VP of LatinosinHigherEd, I had the opportunity to address bugs and tickets that allowed me to change the front-end of the site, most of which Milton passed down to me. After a few months of doing basic HTML and CSS changes I experienced an epiphany….the "aha moment".

It just hit me, I literally told my self "you can do this for a living, there has to be more to this". That's when I decided to take it to the next level and embark on a new coding journey. On January 1, 2014, was the day I decided to take the first leap in teaching myself to be a true Software Engineer. A few weeks later, Milton offered me the opportunity to get my feet wet and took me on as a Web Developer Intern with his startup called PicsSpotr. I focused on developing email templates, marketing collateral, internal documentation as well as some landing pages. Shortly after my internship ended, I couldn't wait to get my hands on a new project to work on or technology to learn. So…

I set out a plan on how to achieve great coding goodness, I set out a timeline of 3 years to learn how to code professionally and accomplish a full career. So what did I do the next day? Take on a freaking freelance project! WHAT! WHY?

My good buddy TJ Green who owned a barbershop in Ansonia CT, by the name of Diamond Cutz needed a site for his customers and barbers to communicate. I immediately thought it was a simple project to take on and looking back I was only two days into coding and I was in for a treat of frustrations and long nights.

The decision was made to write the simple front end site in HTML and CSS with some functionality to make appointments via a contact form built in PHP. I struggled to get the job done and found myself living in Stackoverflow and other support communities. After a few weeks of searching, it just wasn't enough, I realized I needed to take a step back and learn basic core programming concepts.

My First Crack at a Formal Coding Education

With the help of Youtube, Udemy, Codecademy, and Code School, I was able to get the site up and running. It was then that I realized that the self-taught route was a tough one. I realized there was a tough road ahead and I was ready to make a lot of mistakes with my code. With that approach in mind, I decided to level up and learn Javascript, and that's when I realized the complexity of applying core programming concepts, HOISTING ANYONE!!!??. So to remedy that, I started to search my local meetup scene at the time in New Haven, CT.

I decided to try the Thinkful front-end course and spend 3 months with a mentor learning basic front-end programming. On the meetup side of things I found an amazing meetup group called A100- a meetup for aspiring developers to learn how to code. A100 is also an apprentice program for developers to work with local entrepreneurs to build MVP for local startups. The A100 scene was awesome, I met all types of developers with different levels of programming abilities. A few months later, I wrapped up the Thinkful front-end course and after trying to convince myself I could hack it, I finally decided to put an application in for the A100 Apprenticeship program.

Next, the Coding Challenge, and Imposter Syndrome

Run! is what I wanted to do when I cracked open the A1oo coding challenge. I immediately started to question my programming and problem-solving abilities, which, I think we call the imposter syndrome. However, with the help of the Thinkful course and short stint as a freelance developer I was able to muster up some 'cojones' and complete the coding challenge. I got half of the questions right and earned a chance to interview with a few of the A100 site managers for consideration. Ultimately, I earned my spot as an Apprentice for the Summer 2015 Cohort in Stamford with the A100 program, and boy I felt like I was on top of the world!

Here comes the A100 Apprentice Program

I was so excited to finally be a part of a development team and prove to myself that I can do this. A few weeks into the A100 program, we covered HTML, CSS, Meteor, MongoDB, and the Agile Methodology. Eventually, they broke us down into teams in order to prepare us to build an MVP for a local entrepreneur. Shortly after, we broke into our teams to learn more about each other's technical abilities and get a sense of the culture fit.

It was then when I realized that I was one of two Apprentices that didn't come from a traditional CS background. By default, I started to question my abilities again, specifically how much of a contribution I was able to provide to the team's codebase given the lack of CS and programming knowledge I had compared to the other Apprentices with CS majors. For a good week, I was in a rut and found myself scrambling to look for additional resources on how to build a full-stack application. I was in panic mode for sure.

However, its usually times like these that I tend to flourish, I pushed myself to learn quickly and respond even faster when it came to bugs or simple implementation of a new feature. I was able to stay afloat and keep up with the other Apprentices on my team and contribute code and apply my soft skills. Thanks to teammates like Michael Solati who I spent a few long nights virtually coding and debugging to complete our user stories and deploy on time. Ultimately, we built a sports fantasy league service focused on social communication called Fantasy Squared.

In addition, the A100 program required us to present our own final project. I teamed up with a fellow Apprentice and good friend Joe @Eindacor_DS. We both buckled down and built one of my initial project ideas called Two Bits, a reservation management tool for barbershops and salons using Twilio's API.

On final demo day, Joe and I demoed the MVP of Two Bits to our peers, Apprentices, and hiring managers. Overall, my journey with A100 was captivating! It was a learning experience that I would forever appreciate.

I was so confident that I would land a job right after the program. Shortly after I graduated out of the A100 program, I went out on a hunt for my first role as a Developer.

Start… Stop… Keep Pushing.

After a great experience with the A100 program I ended up moving my family back to East Harlem NYC. I was confident that I could land a role as a Developer in NYC after going through the A100 program, but I quickly found out how much I didn't know. I also found myself on the unemployment line which truly was bad timing after my time at LatinosinHigherEd.com. However, I took advantage of that opportunity because being unemployed meant I had a lot of time on my hands and it was an opportunity for me to put 100% focus on leveling up as a developer. That's exactly what I did.

A few months later, A100 comes knocking on my door with an employment opportunity. The Apprentice program that I just graduated from a few months earlier offered me a role as a Site Manager. It felt surreal and nerve-wracking to be on the other side of the coin. Alongside the A100 team, I was responsible for managing 12 developers during my cohort as a Site Manager. We successfully built two MVP versions of a proprietary project called Listenable.

After a grueling 12 week Cohort, the Apprentices picked up a new framework called Meteor, MongoDB, getting acclimated with the Agile Methodology and staying up long hours, it was gratifying to see the Apprentices demo and the entrepreneur happy with their MVP. Everything came into full circle with the A100 program.

Working with the A100 program as a Site Manager felt like it was a step in the right direction It provided me with much needed Project Management skills. I had the opportunity to manage developers and entrepreneurs during the cohort and put Apprentices in a position to be hired by our partner companies. Working for A100 really put me in a position to take my next step in my journey.

After my time with A100 I was about two years into my plan in becoming a software engineer and making that full career switch transition. I once again found myself with an opportunity to level up with all the extra time I had. I took a long hard look back at the last two years and how much progress I made as a "developer in training" and came to the conclusion that the only next viable step was to go through a Bootcamp in NYC. I thought if I could graduate from a Bootcamp it would round out my experiences working in the startup and tech industry.

So that's what I did, I applied to a Bootcamp prep course with Hack Reactor and then applied to Thinkful Full Stack Immersive Bootcamp.

Part Two >>