Sefism is free for learners. We are here to help you grow, one step at a time.Join for free
Sefism.

Roadmap · Build products

Mobile development (React Native)

Opens with credits

For programmers who want to build and ship real Android and iOS apps with Flutter, React Native, Kotlin or Swift. By the end you can build a multi-screen app that works offline, uses device features, is tested and accessible, and is live in a store with real users.

Curated by Tauseef Fayyaz7 stages, 66 topics~15 months at a few hours a week
Start the roadmapSign up to track your progress

By the end, you will be able to

  • Build a multi-screen app with clear state management and navigation on your chosen platform
  • Fetch, cache and sync API data so the app keeps working without a connection, with tokens in secure storage
  • Use the camera, location and notifications with permission flows that handle a user saying no
  • Test core logic and one full user flow, profile a release build and complete that flow with a screen reader
  • Publish an app through Google Play closed testing or TestFlight with crash reporting live

The path

7 stages, in the order to learn them. Open one to start.

  1. 1JavaScript and TypeScriptLearn the language your apps will be written in before touching UI code. Null safety, collections and async code matter more on mobile than most beginners expect.9 topics · ~2 months
    1. 1Values, types and equalityJavaScript has a handful of simple types, called primitive types: string, number, boolean, null, undefined, bigint and symbol.
    2. 2Functions, closures and thisIn JavaScript, functions are values, and React Native code passes them everywhere: onPress handlers, callbacks for array methods and hooks.
    3. 3Arrays, objects and destructuringScreens are built from arrays of objects, so learn to work with them fluently.
    4. 4Immutable updatesReact redraws a screen when state changes.
    5. 5TypeScript types and interfacesTypeScript adds types to JavaScript.
    6. 6null, undefined and optional valuesJavaScript has two empty values.
    7. 7Promises and async/awaitNetwork calls, storage reads and permission requests all return Promises in React Native.
    8. 8Errors in sync and async codeWrap awaited calls, the ones built on Promises, in try and catch.
    9. 9Modules and npmEach file is a module: it shares code with other files through export and import.
    9 in this stageOpen this stage
  2. 2React and React Native componentsBuild screens the way your platform expects: small composable pieces, layout, lists, images, forms and theming. The aim is to turn a design into a screen that looks right on a small phone and a large one.10 topics · ~3 months
    1. 1Components, props and JSXA React Native screen is a tree of components.
    2. 2Expo Go, development builds and Fast RefreshStart with Expo.
    3. 3View, Text, Image, Pressable and ScrollViewReact Native draws real native views, not HTML, so there are no divs or spans.
    4. 4Flexbox layoutLayout in React Native uses Flexbox, a set of rules for sharing space between children.
    5. 5Safe areas and screen sizesContent must stay clear of notches, camera cut-outs, the home indicator and system bars.
    6. 6State with useStateuseState gives a component a value that survives re-renders, plus a setter function that schedules a new render.
    7. 7FlatList for long listsA ScrollView draws all its children at once.
    8. 8TextInput, forms and the keyboardA TextInput is usually controlled: its value comes from state, and onChangeText updates that state.
    9. 9Styling, theming and dark modeStyleSheet.create keeps styles next to each component.
    10. 10Platform differences and design guidelinesReact Native uses native views, so some things already look native, but many choices are still yours.
    10 in this stageOpen this stage
  3. State management and navigationStructure an app with several screens: where state lives, how screens share it and how users move between them. This is where apps stay maintainable or turn into a tangle of callbacks.10 topics · ~2 monthsOpens with credits
  4. Networking, APIs and local storageFetch data from REST APIs, cache it and store it on the device so the app works on a slow or missing connection. Offline-first design and secure token storage separate a real app from a demo.9 topics · ~3 monthsOpens with credits
  5. Device features, permissions and notificationsUse what makes a phone a phone: camera, location, local and push notifications, background work and the permission flows around them. Getting permissions and background limits right keeps the app installed and out of review trouble.8 topics · ~2 monthsOpens with credits
  6. Testing, performance and accessibilityProve the app works and keeps working: automated tests, profiling for dropped frames and memory, and accessibility checked with a real screen reader. Most student portfolios skip this stage, which is why it stands out.10 topics · ~2 monthsOpens with credits
  7. Publishing to Google Play and the App StoreShip the app to real users: signing, store listing, privacy declarations, beta testing, review guidelines, crash reporting and analytics. An app real testers use counts for more than five unfinished repositories.10 topics · ~6 weeksOpens with credits
Keep reading

5 more stages, 47 more topics, free with an account.

You have seen the open stages of the Mobile development roadmap. Every topic it covers is listed above, and an account opens the rest: what each topic means, a question to check yourself, the courses, the practice and Tauseef's advice for every stage. Early access is open: sign up and your account is active shortly after.

Everything here is free to learn from. A few things, like adding a roadmap, keeping a cheat sheet or asking Tauseef a question, use credits. You get 15 when you join, your first roadmap is free, and if you are learning seriously and run out, you can ask for more. Credits only make sure the platform goes to people who are actually learning.

Sign up freeBook a free call

Related on Sefism

Picked from the other libraries by shared topics.

Best practices

See all

Checklists

See all

Project structures

See all

Career questions

See all
Work with me

Stuck on something specific?

Writing only gets you so far. If you want an answer to your situation rather than the general case, book a session and we will work through it together. Sessions are free for approved Sefism members, and a few slots open each week.

  • 1:1 Mentorship
  • Fresh Graduate Mentorship
  • Career Guidance
Book a free sessionSee all services

Brand deals, promos and partnerships: tauseeffayyaz@gmail.com