-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
Initially, I debated between Kotlin, Flutter and React Native. Having some experience with React from an excellent course, as well as building an internal tool for my job in React, it seemed like a great idea to try React Native. This came quite naturally, as Native is very similar to React, with setting up a screen being as easy as wrapping some content in a component. Other components also baked into react native such as , and make prototyping a breeze. The CSS-like styling is also simple to use, making UI design and testing easy enough. For building and deployment, Expo was a dream - fast reloads for previewing, the ability to flip between web and android via hardware or an emulator, and even handling building of APKs through EAS - perfect for this small project. Expo also has it's own set of well-documented packages available for use, making things like using Android's file system for a built in SQLite database easy. Homepage Simple - two buttons and a navigation container dealt with by react-navigation. Combo List The first portion of this was setting up the SQLite database. This is split into two parts: the user and built in databases. The user portion just generates a .db file, and contains all of the CRUD operations as separate functions. Different buttons are linked to these so you can create combinations, read and output them as a list, update their names and delete them. This is also where import/export is handled - which simply uses the expo filesystem to push out and pull in .db files, replacing whatever was there before. The built-in database is much simpler - it uses filesystem to download the built-in DB from the app's assets folder, then uses a basic SQL query to print them out. Workout Setup This is where the user sets up their Workout - in case you hadn't guessed. This is simply a set of buttons, toggles and text boxes - each parameter set here is then pushed over to the Workout screen. Workout Most of the logic goes on here. A couple of timers tick down, with the round timer being switched with the rest timer as it hits 0, and vice versa. The combination visual works by putting the selected database combinations into an array, then using a random number to select an index in the array. The rest is quite simple - a pause/play which will stop/start the timer ticks, a skip feature which allows the user to instantly set the current round/rest timer to 0, an extend rest function which allows the user to add 10 seconds to the current rest timer, and a cancel workout button which returns the user to the set up page. Future Aside from the additional features already mentioned, I don't think this app needs to be overcomplicated - it does exactly what I needed it to and I can't see it becoming obsolete anytime soon. However, the code is all open source - if anyone has ideas, I'll continue maintaining the repo, looking at PRs, etc. Depending on how large the user base grows, hypothetically, it would also be cool to have a hub for uploading combo databases. This could even separate by sport - boxing, karate, TKD - anything that involves drilling could make use of the system. If users were able to head somewhere and grab, say, a largely populated advanced boxing database, that would be very cool. Another interesting idea for me is logging - having the app log how many workouts you've done, display statistics, maybe even some sort of achievement / badge system. Gamifying anything always turns out to be a great motivator in my case, and I'm sure it wouldn't be a feature that goes unappreciated! All said, please feel free to poke around the codebase and make the app work for you however you'd like to :) The GitHub does have a few releases attached where you can download and run the APK on your own Android device! https://github.com/JJB9922/MuayThaideas/releases Acknowledgements Thanks to @menilek for giving the push to attach a blog to this project :) Do follow if you're interested in blogs from an experienced full-stack engineer!