skills.rest
Renzo-Tognella
Renzo-TognellaCOMMUNITY
Explore all skills by this author →
GitHub

Engenharia de Software Frontend (React Native) - PerfectJob

Configures React Native, Expo, and TypeScript mobile app development with navigation, state management, and styling tools.

Updated Apr 26, 2026
Search Tags:#testing#security#state management#UI/UX#performance optimization#React Native#mobile app development
One-click install
npx skills add https://github.com/Renzo-Tognella/UniversalThingsForMyAgents --skill engenharia-de-software-frontend-react-native-perfectjob
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Engenharia de Software Frontend (React Native) - PerfectJob
Source: https://github.com/Renzo-Tognella/UniversalThingsForMyAgents/tree/main/skills/frontend
Command: npx skills add https://github.com/Renzo-Tognella/UniversalThingsForMyAgents --skill engenharia-de-software-frontend-react-native-perfectjob

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react-native, typescript, expo, react-navigation, tanstack-query, zustand, axios, jest, react-native-testing-library, prettier, eslint, maestro, expo-image, react-native-mmkv, react-native-ssl-pinning, react-native-obfuscating-transformer, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill unit provides best practices, architectural patterns, and conventions for developing mobile applications with React Native, aiming to improve the development process of the PerfectJob project.

Core Features & Use Cases

  • Technology Stack: Offers a comprehensive set of tools and libraries for React Native development, including React, TypeScript, Expo, and navigation libraries.
  • Navigation: Includes configuration for React Navigation, enabling stack, tab, and drawer navigators.
  • State Management & API: Utilizes TanStack Query and Zustand for server and client state management, with Axios for API interactions.
  • Styling: Employs StyleSheet, Design Tokens, and Reanimated for styling and animations.
  • Performance & Monitoring: Utilizes performance tools and best practices, including React Native Performance, FlashList, and react-native-mmkv.
  • UI/UX Principles: Focuses on mobile-first design, performance, state management, and navigation.
  • Design Patterns: Implements patterns like Compound Components, Render Props, Custom Hooks, Container/Presentational, and Observer for clean and scalable code.
  • Best Practices: Includes API client setup, query keys centralization, optimistic updates, infinite scroll, error boundary, image loading, and security practices.
  • Testing: Offers a testing structure with unit tests, integration tests, and E2E tests.

Quick Start

Integrate the React Native frontend codebase from this skill unit into your project for a robust, performance-optimized mobile application development process.

Frequently Asked Questions about Engenharia de Software Frontend (React Native) - PerfectJob

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What is the best way to structure a React Native app with React Navigation and state management?▼

The best way to structure a React Native app involves configuring React Navigation for stack and drawer navigators, using Zustand for client state, and TanStack Query for server state. This architecture ensures scalable navigation and state management.

How do I optimize React Native performance using FlashList and MMKV?▼

Optimize React Native performance by leveraging FlashList for efficient list rendering and react-native-mmkv for synchronous key-value storage. These tools reduce UI thread blockages and improve overall mobile app responsiveness.

How do I implement SSL pinning and code obfuscation for React Native security?▼

Implement React Native security by configuring react-native-ssl-pinning to secure API network requests and applying react-native-obfuscating-transformer to obfuscate source code, protecting the mobile app against reverse engineering and data interception.

Can I use Expo with TypeScript for React Native mobile app development?▼

Yes, you can use Expo with TypeScript for React Native mobile app development. This Skill provides a comprehensive environment integrating Expo, TypeScript, and Axios to build type-safe mobile applications with modern tooling.

What testing libraries do I need to run unit and E2E tests for a React Native app?▼

To run unit and E2E tests for a React Native app, you need Jest and react-native-testing-library for component integration tests, alongside Maestro for end-to-end testing workflows to validate mobile UI interactions.

How do I manage API interactions and optimistic updates in React Native?▼

Manage API interactions in React Native by using Axios for requests and TanStack Query for server state. Centralize query keys and implement optimistic updates to immediately reflect UI changes before server confirmation.

Related Skills

Explore More Software Engineering Skills→
shahmirerrorshahmirerror

revenuecat

Configure RevenueCat in-app purchases for Expo/React Native apps.

Community
Advanced
msichtermanmsichterman

expo-dev-client

Create and distribute Expo development clients for iOS and Android testing.

Community
Intermediate
7a336e6e7a336e6e
1

integrating-api

Implement a type-safe API client with TanStack Query and Axios/Fetch.

Community
Intermediate
seasuseasu

flutter-dev

Develop, modify, debug, and architect Flutter and Dart applications.

Community
Advanced