[{"data":1,"prerenderedAt":158},{"projects-zoeto-en":2},{"id":3,"title":4,"body":5,"description":135,"extension":136,"image":137,"link":138,"links":139,"meta":146,"navigation":147,"path":148,"position":127,"role":149,"seo":150,"stem":151,"tags":152,"type":156,"__hash__":157},"projectsEn\u002Fen\u002Fprojects\u002Fzoeto.md","Zoeto",{"type":6,"value":7,"toc":125},"minimark",[8,25,38,51,85,95],[9,10,13,18,22],"div",{"className":11},[12],"row",[14,15,17],"h2",{"id":16},"context","Context",[19,20,21],"p",{},"Zoeto is a mobile app that gives veterinarians easy access to the Zoetis product catalogue. It includes detailed information about medicines, including composition, indications, packaging and prices.",[19,23,24],{},"We developed the app for an external company that hired us to build it.",[9,26,28,32,35],{"className":27},[12],[14,29,31],{"id":30},"my-role","My role",[19,33,34],{},"I coded the app according to the graphic design prepared in-house. I was in contact with the external company and usually led the meetings for our side, together with a colleague responsible for the backend.",[19,36,37],{},"After the launch I regularly updated the libraries and React Native itself, uploaded new releases for internal testing on Google Play and generated APK files so developers could test the app.",[9,39,41,45,48],{"className":40},[12],[14,42,44],{"id":43},"challenge","Challenge",[19,46,47],{},"This was my first experience with native apps and with React Native. To get started I took the course React Native – The Practical Guide by Maximilian Schwarzmüller on Udemy.",[19,49,50],{},"While building the screens I met many new things: Xcode, Android Studio, simulators and native code. To build the app and submit it to TestFlight I signed it with the certificates and provisioning profiles I received from the Zoetis developers.",[9,52,54,58],{"className":53},[12],[14,55,57],{"id":56},"solution","Solution",[59,60,61,65,68,71,74,82],"ul",{},[62,63,64],"li",{},"The project started on Expo and over time we moved to plain React Native.",[62,66,67],{},"React Navigation serves as the router and checks whether the user is logged in, unlocking the main app content.",[62,69,70],{},"Axios handles API communication and Redux handles the core app logic.",[62,72,73],{},"I built the animations in React Native Reanimated. The main one is the expanding catalogue, where users open nested categories and see products by specification.",[62,75,76,77,81],{},"The client later chose Gigya (SAP Customer Data Cloud) for registration and login. I integrated the ",[78,79,80],"code",{},"@sap_oss\u002Fgigya-react-native-plugin-for-sap-customer-data-cloud"," plugin and refactored part of the logic on the frontend and on the API side.",[62,83,84],{},"We chose Firebase for push notifications. The feature kept growing: besides the notification list, detail and settings screens it had to work correctly on both platforms, which led me to changes in the .NET API.",[9,86,88,92],{"className":87},[12],[14,89,91],{"id":90},"result","Result",[19,93,94],{},"The app is released on iOS and Android and helps veterinarians find their way around medicines and buy them.",[9,96,98,102],{"className":97},[12],[14,99,101],{"id":100},"technologies","Technologies",[59,103,104,107,110,113,116,119,122],{},[62,105,106],{},"React Native",[62,108,109],{},"SAP Gigya plugin for processing user data",[62,111,112],{},"Firebase (Messaging, Notifee)",[62,114,115],{},"React Native Reanimated",[62,117,118],{},"React Navigation",[62,120,121],{},"Redux.js",[62,123,124],{},"Axios (for REST APIs)",{"title":126,"searchDepth":127,"depth":127,"links":128},"",2,[129,130,131,132,133,134],{"id":16,"depth":127,"text":17},{"id":30,"depth":127,"text":31},{"id":43,"depth":127,"text":44},{"id":56,"depth":127,"text":57},{"id":90,"depth":127,"text":91},{"id":100,"depth":127,"text":101},"A product catalogue of Zoetis medicines for veterinarians, released on iOS and Android. I built the whole app in React Native, including SAP Gigya sign-in and Firebase push notifications.","md","\u002Fimages\u002Flogo_zoetis.svg",null,[140,143],{"url":141,"text":142},"https:\u002F\u002Fapps.apple.com\u002Fcz\u002Fapp\u002Fzoeto\u002Fid6447378302","iOS App",{"url":144,"text":145},"https:\u002F\u002Fplay.google.com\u002Fstore\u002Fapps\u002Fdetails?id=com.zoeto&hl=cs&pli=1","Android App",{},true,"\u002Fen\u002Fprojects\u002Fzoeto","Mobile developer, the whole app and client communication",{"title":4,"description":135},"en\u002Fprojects\u002Fzoeto",[106,153,154,155],"Expo","Firebase","TypeScript","Mobile app · React Native","rk7SP3xYABw4m26h3Ha22EbnRPNlXTPXgS6X9vaAbKc",1792435547423]