Looking back to , when we started to build up the foundations for , one of our engineering team’s first important decisions was to choose the right set of frameworks, front-end tools, back-end tools, and services to build a state-of-the-art product that delivers a delightful to our customers. Apart from the end-user experience, it was important for us to choose a collection of tools that allows us to have an enjoyable for our tech team and future team members. November 2018 TAIKAI user experience developer experience When you are choosing tech stack from the ground up, you have the power to go to the market and pick the bright tools from the shelves, but then you should be smart enough to pick the right ones for your job. The technologies used to build up your SaaS product should allow you to: Deliver new features and changes across components at a high pace; Continuously deliver changes to production with a small effort, no human intervention, and high reliability ( ); Continuous Delivery Scale and manage the production, staging, and testing environments with a limited number of human resources ( ); Almost no DevOps Scale the team and quickly onboard new team members and make them productive in a short period of time; Have a long term vision, the technology should have an active community with plans to maintain and improve it; Early Days After a few iterations and POCs (Proof of Concepts) and experiments, we finally found out what was TAIKAI base tech base that remained almost untouched until today and we didn't regret what we have chosen. This important time window where we did experimentations was crucial to our success since we tried different approaches. We learned what was really important in our infrastructure to build a long-lasting tech stack that delivers our developers’ perfect experience. At the same time, it delivers a smooth experience to our customers. We did our research, we end up finding a from Wes Bos, a premium training course that completely inspired us to try the “ ” tech stack. 🙏 Fullstack Advanced React & GraphQL Course Node.Js + React.js + Prisma + GraphQL+ Next.js After working with it for a couple of weeks, we were very proficient and productive with it. The vast community, the reliability, and the documentation available for these technologies allow us to move on with confidence and embrace them as our day-by-day base tools to build up the product that we dream of for our customers. Most of our team, at that time, had vast experience in C++, Java, and Ruby but the transition to our new JavaScript stack was not a huge hurdle for us. In a couple of days, we constructed our first GraphQL API endpoints, and afterward, we started to integrate the endpoints in our fresh web app. The first prototype worked like a charm, so we rolled up our sleeves to deliver our MVP in a couple of months, just in time for our first Hackathon. The rest is history! Next.js/React.js 🤝 Continuous Integration Using the experience and skills from other jobs, we built up a continuous integration pipeline based on Docker to integrate our Frontend+Backend and run autonomously our unit tests, fully integrated test suites, and verification processes. Even though this is an opaque/invisible process for our customers, we keep trying to automate it as much as possible because it allows our tech team to have time to focus on more business-oriented tasks (new features, bug fixes, analysis, etc). I remember, from some of our previous jobs, how painful and cumbersome this process can be when you need to deliver changes to staging environments with a bunch of scripts following a tedious recipe crafted by the IT Team. Our continuous integration pipeline, built on Jenkins, can deliver an instance of the whole platform to one of our staging environments in a matter of seconds, allowing us to test a developer change in a snap. 💥 Our approach based on docker containers allows us to test and run our software on a fully controlled operating system that can be instantiated on any cloud provider that supports docker deployments (Microsoft Azure, Google Cloud, Amazon, etc). BTW, In 2020 we migrated to a new cloud provider successfully in a matter of days. 😲 📏 Measure, Track, and Tune the ship In a early days, apart from delivering a high number of features to your customers, it is essential to deliver the features that bring value to them with an efficient UI/UX and less service disruption of service as possible. If your product delivers value to them consistently on a daily basis, they will be your best advocates and spread the word about your product to their friends, colleagues, teammates, or even their bosses. This organic growth will save your company from spending a tremendous amount of money on marketing campaigns and extend your startup runaway. 🙌 SaaS product’s Since day one, we actively and accurately measure and track our infrastructure, tech stack, and consume the feedback to improve our product and developer experience. We track our Frontend and Backend , API query/mutations processing times, rendering metrics, and loading times to continuously enhance our product and provide a five-star ⭐️ experience. Crashes React.Js Apart from technical metrics, we also try to gather some feedback from our users to polish the features that matter most to them. For example, since our matchmaking feature launch, we have been getting feedback from our community to make the team creation in hackathons a pleasant experience in this new fully online context. Don’t waste your precious engineering resources developing features that nobody will pay a dime for it, so please have a simple plan to identify the essential features to your business. 📦 Continuous Delivery Our development process, inspired by allows us to iterate and make changes with a high level of confidence. Starting with that and using a based service delivery, we were able to deliver the changes introduced by our engineering team to production, or demo stages in a matter of minutes. This high flexibility allows us to deliver cross-component features, bug fixes, or rolling back deliveries quickly with almost no human intervention. git flow , Kubernetes In my opinion, this is an important process for any SaaS startup, especially at the beginning when you are tuning your product to fit your customer or market needs. I call it the and I recommend you to have it in mind and take it into account when you are building your delivery pipeline. Software Manufacturing Cycle Time, Summing Up The technologies and the tools that you embrace on your day to day play have an important role in your SaaS product success. During your startup growth stages, it is required to embrace changes in circumstances, so your engineering should be ready to adapt and modify the product quickly to fit the customer and community needs. If you use the wrong tools, any change could take weeks to accomplish and burn your tiny startup budget quickly. Be smart and use the right tools for the job. Simplify and keep testing your assumptions with real users. Always measure and make decisions based on numbers and facts. Web technologies keep evolving swiftly, so do your research and make sure you choose technologies for the long term. Your goal is not to use the state of the art technology but built a state of the art product that matters today and tomorrow. This post is part of an that will publish in the upcoming months to share some insights about our engineering and development processes. Engineering series In the next post, we will share more details about our , the UI framework used to build our responsive smart user interfaces. “TAIKAI UI Design System” Thank you for reading! Want to learn more about us? About what we do? Check our website or ping us on Twitter Previously published at https://taikai.network/en/blog/right-stack-to-saas-product
