Instalaciones recomendadas para el curso de React Native

ReactNative-instalaciones.md

Instalaciones - Curso de React Native

Esta es la lista de instalaciones recomendadas para el curso de React Native, si encuentran enlaces adicionales o cambios en esta hoja, pueden hacerlos.

Instalaciones Necesarias

• Visual Studio Code

• Postman

• Mongo Compass

• Git

git config --global user.name "Tu nombre"
git config --global user.email "Tu correo"

• Node

• Docker Desktop

• Android Studio

• XCode - SOLO en MAC OSX

Extensiones de VSCode

• Activitus Bar

• Error Lens

• ES7 React/Redux

• Simple React Snippets

• Auto Close Tag

• Paste JSON as Code

• TypeScript importer

Temas que estoy usando en VSCode:

• Aura Dark

• Monokai Night

• Tokyo Night

• Iconos

Mis wallpapers

• Wallpapers Developer

Comunidad de Discord

Adicional (Opcional)

Muchos me preguntan sobre mis ajustes de VSCode, aquí se los dejo como los estoy usando en este curso:

{
    "editor.tabSize": 2,
    "editor.detectIndentation": false,
    "editor.insertSpaces": true,
    "terminal.integrated.fontFamily": "MesloLGM NF",
    "explorer.compactFolders": false,
    "workbench.iconTheme": "material-icon-theme",
    // "material-icon-theme.activeIconPack": "qwik",
    "workbench.startupEditor": "none",
    "workbench.colorCustomizations": {
        "statusBar.background": "#121016",
        "statusBar.debuggingBackground": "#121016",
        "statusBar.debuggingForeground": "#525156",
        "debugToolBar.background": "#121016",
    },
    "[dart]": {
        "editor.formatOnSave": false,
        "editor.formatOnType": false,
        "editor.selectionHighlight": false,
        "editor.suggest.snippetsPreventQuickSuggestions": false,
        "editor.suggestSelection": "first",
        "editor.tabCompletion": "onlySnippets",
        "editor.wordBasedSuggestions": false
    },
    "explorer.confirmDelete": false,
    "[json]": {
        "editor.defaultFormatter": "vscode.json-language-features"
    },
    "explorer.confirmDragAndDrop": false,
    "extensions.autoUpdate": false,
    "git.enableSmartCommit": true,
    "terminal.integrated.enableMultiLinePasteWarning": false,
    "workbench.layoutControl.enabled": false,
    "window.commandCenter": false,
    "security.workspace.trust.untrustedFiles": "open",
    "git.openRepositoryInParentFolders": "never",
    "git.confirmSync": false,
    "codesnap.backgroundColor": "rgba(0, 0, 0, 0.0)",
    "editor.minimap.enabled": false,
    "workbench.activityBar.visible": false,
    "window.titleBarStyle": "custom",
    "codesnap.boxShadow": "rgba(0, 0, 0, 0.55) 0px 0px 20px",
    "terminal.integrated.env.osx": {
      "FIG_NEW_SESSION": "1"
    },
    "audioCues.diffLineDeleted": "off",
    "editor.accessibilitySupport": "off",
    "workbench.colorTheme": "Tokyo Night",
    "liveServer.settings.donotVerifyTags": true,
    "git.autofetch": true,
    "editor.cursorBlinking": "smooth",
    "editor.cursorSmoothCaretAnimation": "on",
    "editor.cursorWidth": 2,
    "reactSnippets.settings.importReactOnTop": false,
    "window.zoomLevel": 4,
    "codesnap.shutterAction": "copy",
    "codesnap.showWindowControls": false,
    "dart.flutterSdkPath": "/Users/strider/Development/flutter",
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBraces": true,
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": true,
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": true,
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces": true,
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBraces": true,
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": true,
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": true,
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces": true,
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": true,
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": true,
    "typescript.format.semicolons": "insert",
    "typescript.preferences.quoteStyle": "single",
    "javascript.format.semicolons": "insert",
    "javascript.preferences.quoteStyle": "single",
    "javascript.preferences.jsxAttributeCompletionStyle": "none",
    "javascript.preferences.useAliasesForRenames": false,
    "typescript.preferences.jsxAttributeCompletionStyle": "none",
    "typescript.preferences.useAliasesForRenames": false,
    "github.copilot.enable": {
      "*": false,
      "plaintext": false,
      "markdown": true,
      "scminput": false
    },
    "dart.showInspectorNotificationsForWidgetErrors": false,
    "editor.guides.bracketPairs": "active",
    "editor.guides.bracketPairsHorizontal": true,
    "files.associations": {
      "*.css": "tailwindcss"
    },
    "editor.defaultColorDecorators": true
}

Comunidad de Discord

Los invitamos a que se unan a nuestra comunidad de estudiantes en Discord y habla con personas que también estan aprendiendo igual que tu sobre diversas tecnologías.

muy emocionado de poder expandir mis conocimientos al lado de este excelente profesor.. Sin duda los cursos de fernando me generan grandes expectativas

Comenzando!!!... allá vamos!!!!

Si bien Bracket Pair Colorizer 2 está deprecado, pueden usar Bracket Pair Colorization Toggler. Aquí les dejo mi configuración para el settings.json:

    "workbench.colorCustomizations": {
        "editorBracketHighlight.foreground1": "#a4d7ea",
        "editorBracketHighlight.foreground2": "#c462ad",
        "editorBracketHighlight.foreground3": "#F7C244",
        "editorBracketHighlight.foreground4": "#F07850",
        "editorBracketHighlight.foreground5": "#9CDD29",
        "editorBracketHighlight.foreground6": "#C497D4",
    },

Genial @tabraue, esto puede ser de gran utilidad 👍

Lo unico es que debe cambiar el
"window.zoomLevel": 4,
a
"window.zoomLevel": 1,

por que asumo que fernando lo tine en 4 por el tema de los videos

Gracias @Klerith , @tabraue y @FidelLascano.

Iniciando hoy al fin 🥹

Comenzando con toda! 🙌

🤩

Para los que vayan empezando el curso... la extensión "ES7+ React/Redux/React-Native snippets" ya incluye un snippet para componentes RN... el problema es que ahora empiezan con ts (antes empezaban con rn)... ejemplo: tsrnf o tsrnfs

empezando el curso , gracias por todo

Empezando el curso, espero cumpla mis expectativas, gracias

Saludos, iniciando el curso, hasta el momento se ve genial, Gracias por los compartir esos datos 😊