Mobarista

Goal:

My focus on this test is to display the wider knowledge i have as a professional as i can in the time invested. I may briefly, but enoughly covered many subjects that i consider relevant for a JS professional. Them being:

Clean and comprehensive code
good architecture, ability to think and organize massive projects.
capability to operate the libraries suggested by the company

Im aware of many points of improvement or that i deliberatley skipped for the sake of focusing on different things, or that i thought the knowledge/challenge they represent where already covered.

Installation and usage

npm install
npx nx run mobile:start(will start metro for the mobile app)
- its important to ensure node-modules in the apps are linked with: npx nx run mobile:ensure-symlink
npx nx run mobile:run-android (will launch android)

(with Nx vscode plugin you can see all commands available)

Architecture:

This project is a Monorepo type(integrated repo). All dependencies are installed on the root folder, and used on packages and apps. Its good because allow ease to implement the pattern and the following possibilities:

apps:
- (all standalone applications, that often get deployed. websites etc. consumers of libs, as explained below.)
libs:
- all that contributes to organize the multiple needs of the application ecossystem.
- they contain for example:
- utils/helpers (pure functions, oftem small like: convertToNumber)
- publishable ESLint especific for the company or project.
- Design Systems
- Services often consumed across apps (eg: CoffeIT.awsUploader(item))

Software decisions:

Subject	Tooling	Motivations
Style	`dripsy`	I never used before, but as long it has styled-component/emotion nature, offers great suport for typescript and theming. Also the `sx` prop is really cool. `chackra-ui` feelings, make easy for me to style faster. also same creator from `moti` maybe make a good combo. Disclaimer: I often dont inline style, but create styles in a separate file, but abused it this time for brevity
Animation	`moti`	It is performant and offers a familiar API as framer-motion, making easy to create simpler transitions, spring animations and so.
ErrorHandling	`react-native-error-boundary` and `react-native-exception-handler`	One offers DOM error placeholder to side with Suspense-mode in react, and the other catches global JS and Native throws.
State and Network data	`react-query` and `redux`	I abandoned redux for almost 4 years now, but seems a plus for you. I reckon the benefits though i couldnt help myself of holding to react-query to handle server/api stuff. its has many benefits i cant number here.
Typescript and data validation	`zod`	Although i didnt used it at all, i would use Zod to declare more niche types (ex: UUID instead of string) and validate it. maybe in conjunction with stuff like react-hook-form

Disclaimers

My windows enviromnent was very buggy, especially running storybook scripts. so it prevented me to do alot of progress on scripting for it. Also incapability to care for iOS.