As a full-stack developer, I’ve been working as a freelancer for a few years, and my major business strategy is to build long-term relationships with each client I’ve worked with, provide the best consulting in web and full-stack development, and care about making each customer happy.
One of my clients had a live streaming platform and was serving a large number of clients, including visitors from tv shows, podcasts, and live events. I was constantly trying to fix any bugs or errors in his platform, as well as protect the payment side.
But the client was always having small tweaks to make analytics for his clients, and he was making analytics as sheets and documents and sending it to each client monthly “+100 client” in emails, which was a lot of work because he needed to prepare hundreds of sheets and emails, and the clients got a boring user experience checking their monthly analytics, and they also asking him to give a yearly analytic each Dec of every year, so he was always dealing with more than 3000 document.
So there was always a question on his mind about how to fix the problem, and one time asked me to meet for an urgent meeting, and we went over this whole complex process of serving analytics to the clients and asked “why not , we automate it?”, or make a web application for it.
So I got the concept, and I also saw how easy it would be to create a webApp where the user could log in and view his monthly and prior month’s statistics.
So, in this blog, I’ll walk you through the steps I took to create the e360tv dashboard.
Step 1: An overview of the project
I received a notion of what the customer wanted, and the major point was that we needed to develop something for B2B, with a high rate of UX, that easy to maintain, and that one of the freelancers could easily enter data.
Step 2: Creating an application’s wireframe and structure
We spent two weeks on this step deciding on the web application’s design, the tech stack we’d utilize, and several brainstorming sessions (“Even I’ll work on it alone LOL”).
So I made a software structure and I got what we will need as result, and after a consulting with So I made a software structure and got what we’ll need as a result, and after consulting with the client, we decided to make LAMP(python) as a stack of our application, focusing primarily on Django as a framework, but after a few days, the client asked for something that would make the admin panel to enter data something beautiful and large scale, so we switched to using Next.js with Node.js on the backend “Strapi as Headless CMS”, So we made a deal on this point, and it turned out to be a brilliant decision, creating a large-scale graphql API, a panel where we can enter data.
Step 3: The application UI/UX design
After sketching a wireframe, I chose to create a user interface with a high rate of UX “Something clean and minimal” as a consequence of the UI/UX design, and the customer liked it right away and realized that his vision was turning into a real solution.
Step 4: The development process
Step 4: Release
After a month, I was able to complete the development process, even my timesheet was full at the time. We released a first demo for the web application, and the client was impressed by the results, even though we encountered a few bugs along the way, but the solution was up and running, and a major problem was solved, saving time, money, and the client’s user experience.
Finally, as a freelancer, you should constantly look for a solution and a long-term relationship with your customer rather than focusing on how much money you can make.
And, I’d want to thank the founder of e360tv for giving me the opportunity to work with him, as well as the developers of Next.js, Vercel, and Heroku for creating a fantastic framework and tools that have greatly aided our development careers.