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.
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
- its important to ensure node-modules in the apps are linked with:
npx nx run mobile:run-android
(will launch android)
(with Nx vscode plugin you can see all commands available)
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)
)
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 |
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.
✨ This workspace has been generated by Nx, a Smart, fast and extensible build system. ✨