{"id":22155558,"url":"https://github.com/odenlerma/todo-app","last_synced_at":"2026-04-28T23:01:41.118Z","repository":{"id":238696516,"uuid":"797271851","full_name":"odenlerma/todo-app","owner":"odenlerma","description":"A todo-app made with React Native CLI with implementation of MMKV as storage and Redux Toolkit with Redux Saga","archived":false,"fork":false,"pushed_at":"2024-05-14T02:19:44.000Z","size":710,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-29T19:15:52.714Z","etag":null,"topics":["javascript","mmkv","react-native","redux-saga","redux-toolkit","todo-app","todo-list-app"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/odenlerma.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-05-07T14:18:02.000Z","updated_at":"2024-05-14T02:19:48.000Z","dependencies_parsed_at":"2024-05-14T03:28:30.340Z","dependency_job_id":null,"html_url":"https://github.com/odenlerma/todo-app","commit_stats":null,"previous_names":["odenlerma/todo-app"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/odenlerma%2Ftodo-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/odenlerma%2Ftodo-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/odenlerma%2Ftodo-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/odenlerma%2Ftodo-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/odenlerma","download_url":"https://codeload.github.com/odenlerma/todo-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245284741,"owners_count":20590309,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","mmkv","react-native","redux-saga","redux-toolkit","todo-app","todo-list-app"],"created_at":"2024-12-02T02:18:31.080Z","updated_at":"2026-04-28T23:01:41.024Z","avatar_url":"https://github.com/odenlerma.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ![TODO](src/assets/svg/TODO%20logo.png)\n\nThis a simple task app that runs Android/IOS. It can add, edit, delete, bookmark and mark as complete tasks. This is made with React Native frameworks and uses MMKV as storage and Redux toolkit with Redux Saga as state management.\n\nThe app prototype was first made using Figma before it undergo development. This ensure smoother development process and avoid redesigning while coding.\n# ![TODO Figma Design](src/assets/png/figma-design.PNG)\n[Figma Link](https://www.figma.com/design/ACmqhQsnEFLSKprQkbxGma/TODO-App?node-id=0%3A1\u0026t=BE12aM5NPNB9dTKF-1)\n\n# Getting Started\n\n\u003e**Note**: Make sure you have completed the [React Native - Environment Setup](https://reactnative.dev/docs/environment-setup)\n\n## Step 1: First clone this repository\n\n```bash\ngit clone https://github.com/odenlerma/todo-app.git\n```\n\n## Step 2: Install dependencies\nMake sure you already have nodejs \u0026 npm installed in your system.\n\nGo to folder and run the following commands:\n\n```bash\nnpm install\n\n#for IOS\ncd ios \u0026\u0026 pod install \u0026\u0026 cd ..\n```\n\n## Step 3: Run application\n### For Android\n\n```bash\nreact-native run-android\n\n# OR \nnpx react-native run-android\n```\n\n### For iOS\n\n```bash\nreact-native run-ios\n```\n\nIf everything is set up _correctly_, you should see your new app running in your _Android Emulator_ or _iOS Simulator_ shortly provided you have set up your emulator/simulator correctly.\n\n# Troubleshooting\n\n## Android - Upgrade to JDK 17 issue\nIf you have encountered JDK issue, this is the workaround steps you can use.\n\n1. Open Android Studio and open your project android folder.\n2. Go to *File \u003e Settings \u003e Build, Execution, Deployment \u003e Build Tools \u003e Gradle* and change Gradle JDK to **Embedded JDK JetBrains Runtime version 17.0.6** . \nNote the path of embedded JDK.\n\n# ![Use Embedded JDK 17](src/assets/png/fix-jdk17error.png)\n\n3. Click \"OK\"\n\n4. Then we need to add the following line in our project. Go to *android/gradle.properties*\n\n```\n org.gradle.java.home={path-to-your-Embedded-JDK}\n```\n5. Save and rerun app\n\nIf you can't get this to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.\n\n# Deployment\n\n## Android - Google Playstore\nFollow the following steps for Publishing to Google Playstore\n\n### Step 1: Generate an upload key\nFirst we need to generate upload key and copy it to our project *android/app* directory. Follow the steps below on how to generate upload key.\n\n**For Windows**\n\nOpen terminal and go to your jdk directory (eg. C:\\Program Files\\Java\\jdkx.x.x_x\\bin) and run the keytool below. Ensure replace *my-upload-key* and *my-key-alias* variable from keytool snippet\n\n```bash\nkeytool -genkeypair -v -storetype PKCS12 -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000\n```\n\n**For macOS**\n\nOpen terminal and locate JDK bin folder by running\n```bash\n/usr/libexec/java_home\n```\n\nGo to the the output JDK location and run keytool command. Ensure replace *my-upload-key* and *my-key-alias* variable from keytool snippet\n```bash\nsudo keytool -genkey -v -keystore my-upload-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000\n```\n### Step 2: Set up Gradle variables\n1. Place the my-upload-key.keystore file under the android/app directory in your project folder.\n2. Edit the file ~/.gradle/gradle.properties or android/gradle.properties, and edit the following (replace ***** with the correct keystore password, alias and key password)\n\n```\n#keystore\nSTORE_FILE=my-upload-key.keystore\nKEY_ALIAS=my-key-alias\nSTORE_PASSWORD=******\nKEY_PASSWORD=*****\n```\n3. Save changes.\n\n### Step 3: Generate AAB\nRun the following command:\n```bash\nnpx react-native build-android --mode=release\n```\nThe generated file should be located inside *android/app/build/outputs/bundle*. This will be file you need to upload to Google Playstore console.\n\n\u003e\u003e Notes: If you are to build for an update for an exisiting playstore app, remember to change *versionCode* and *versionName* from *android/app/build.gradle*\n\n### Testing release build of app\nRun the following command to see release build of app\n```bash\nnpm run android -- --mode=\"release\"\n```\n\nClick [here](https://reactnative.dev/docs/signed-apk-android) ror additional and more detailed steps\n\n## iOS - Apple App Store\nFollow the following steps for Publishing to Apple App Store\n\n### Build app for release\n1. Open .xcworkspace of you project in XCode.\n2. Setup signing configurations. You will need an Apple Developer account here. Click [here](https://developer.apple.com/documentation/xcode/distributing-your-app-to-registered-devices) for additional guides.\n3. Click *Product \u003e Archive* . Make sure to set the device to \"Any iOS Device (arm64)\".\n4. After the archive is completed, in the archive window, click on Distribute App.\n5. Click on App Store Connect now (if you want to publish in App Store).\n6. Click Upload → Make sure all the check boxes are selected, hit Next.\n7. Choose between Automatically manage signing and Manually manage signing based on your needs.\n8. Click on Upload.\n9. Now you can find it in the App Store Connect under TestFlight.\n\nNow fill up the necessary information and in the Build Section, select the build of the app and click on Save → Submit For Review.\n\nClick [here](https://reactnative.dev/docs/publishing-to-app-store) ror additional and more detailed steps\n\n# Dependencies\n\n## React Native MMKV\nRepo: [Link](https://github.com/mrousavy/react-native-mmkv)\n\nThis was used as storage for the tasks. This was used because it is deemed to be faster than AsyncStorage for local storage of data.\n\nSupporting Articles: [Link1](https://blog.logrocket.com/using-react-native-mmkv-improve-app-performance/) [Link2](https://medium.com/@barisberkemalkoc/react-native-mmkv-library-fcc11a0b7628)\n\n\n## Redux Toolkit\nWebsite: [Link](https://redux-toolkit.js.org/)\n\nThis was used because it simplifies state management, reduces Redux boilerplate,  supports async logic, and is officially supported by the Redux team. Since *createStore* was depreciated in Redux and it was suggested to use this instead.\n\n## Redux Saga\nWebsite: [Link](https://redux-saga.js.org/)\n\nThis was used because it will provide a middleware solution for managing side effects, such as asynchronous operations, in Redux applications.\n\n## React Native Animatable\nRepo: [Link](https://github.com/oblador/react-native-animatable)\n\nThis was used for a ready-made and easy to use animation.\n\n## React Native Date Picker\nRepo: [Link](https://github.com/henninghall/react-native-date-picker)\n\nThis was used for modal type picker for date.\n\n## React Native Modal\nRepo: [Link](https://github.com/react-native-modal/react-native-modal)\n\nThis was used for root modal type and is more easier to use than built in modal of React Native\n\n## React SVG and React Native Lottie\nRepo: [SVG](https://github.com/software-mansion/react-native-svg) [Lottie](https://github.com/lottie-react-native/lottie-react-native)\n\nThis was used for customized icons within the app to match app aesthetics.\n\n## React Navigation\nWebsite: [Link](https://reactnavigation.org/)\n\nThis was used for routing screens and passing parameters from one screen to another\n\n# Contributing\nLooking to contribute something to TODO? [Here's how you can help](/Contributing.md).\n\n\n# License:\nThe MIT License (MIT)\n\nCopyright (c) 2024 odenlerma\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fodenlerma%2Ftodo-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fodenlerma%2Ftodo-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fodenlerma%2Ftodo-app/lists"}