Saltar al contenido principal

Configuración

nota

Si estás planeando trabajar en una función, solo avísanos en Discord para que podamos:

  1. Informarte si es algo que aceptaríamos en Immich
  2. Proporcionar orientación sobre cómo se implementaría idealmente algo así
  3. Asegurarnos de que nadie más esté trabajando en ese problema/función para no duplicar esfuerzos

Gracias por tu interés en contribuir 😊

Entorno​

Servicios​

Este entorno incluye los servicios mencionados a continuación. Los detalles adicionales están disponibles en el README de cada servicio.

  • Servidor - /server
  • Aplicación web - /web
  • Aprendizaje automático - /machine-learning
  • Redis
  • Base de datos de desarrollo PostgreSQL con el puerto 5432 expuesto para que puedas usar cualquier cliente de base de datos para acceder a ella

Todos los servicios están empaquetados para ejecutarse con un único comando de Docker Compose.

Servidor y aplicaciones web​

  1. Clona el repositorio del proyecto.
  2. Ejecuta cp docker/example.env docker/.env.
  3. Edita docker/.env para proporcionar valores para la variable requerida UPLOAD_LOCATION.
  4. Desde el directorio raíz, ejecuta:
Iniciar servidor de desarrollo
make dev # se requiere Makefile instalado en el sistema.
  1. Accede a la instancia de desarrollo en tu navegador en http://localhost:3000, o conéctate a través de la aplicación móvil.

Todos los servicios se iniciarán con recarga automática habilitada para una retroalimentación rápida.

Puedes acceder a la aplicación web desde http://tu-IP-de-la-máquina:3000 o http://localhost:3000 y acceder al servidor desde la aplicación móvil en http://tu-IP-de-la-máquina:3000/api

Notas:

  • El contenedor de desarrollo "web" se ejecuta con uid 1000. Si ese uid no tiene permisos de lectura/escritura en los volúmenes montados, podrías encontrar errores
  • En caso de configuración de Docker sin root, necesitas usar root dentro del contenedor; de lo contrario, encontrarás errores relacionados con permisos de lectura/escritura. Consulta los comentarios en docker/docker-compose.dev.yml.

Conectar la aplicación web a un backend remoto​

Si solo deseas desarrollar la aplicación web conectada a un backend remoto existente, sigue estos pasos:

  1. Construye el SDK de Immich - cd open-api/typescript-sdk && npm i && npm run build && cd -
  2. Ingresa al directorio web - cd web/
  3. Instala las dependencias de la aplicación web - npm i
  4. Inicia el servidor de desarrollo web
IMMICH_SERVER_URL=https://demo.immich.app/ npm run dev

Si estás usando PowerShell en Windows, es posible que necesites configurar la variable de entorno por separado de esta manera:

$env:IMMICH_SERVER_URL = "https://demo.immich.app/"
npm run dev

@immich/ui​

Para ver los cambios locales en @immich/ui dentro de Immich, haz lo siguiente:

  1. Instala @immich/ui como un hermano de immich/, por ejemplo /home/user/immich y /home/user/ui
  2. Construye el proyecto @immich/ui mediante npm run build
  3. Descomenta el volumen correspondiente en el servicio web del archivo docker/docker-compose.dev.yaml (../../ui:/usr/ui)
  4. Descomenta el alias correspondiente en el archivo web/vite.config.js ('@immich/ui': path.resolve(__dirname, '../../ui'))
  5. Descomenta la declaración de importación en el archivo web/src/app.css @import '/usr/ui/dist/theme/default.css'; y comenta @import '@immich/ui/theme/default.css';
  6. Inicia el stack con make dev
  7. Después de realizar cambios en @immich/ui, vuelve a construirlo (npm run build)

Aplicación móvil​

Configuración​

  1. Configura la herramienta Flutter usando FVM.
  2. Ejecuta flutter pub get para instalar las dependencias.
  3. Ejecuta make translation para generar el archivo de traducción.
  4. Ejecuta fvm flutter run para iniciar la aplicación.

Traducción​

Para agregar un nuevo texto de traducción, ingresa la clave-valor en el archivo i18n/en.json en la raíz del proyecto Immich. Luego, desde el directorio mobile/, ejecuta

make translation

La aplicación móvil te preguntará qué backend deseas conectar. Puedes utilizar el backend de demostración (https://demo.immich.app/) si no necesitas cambiar el código del servidor ni cargar fotos. Alternativamente, puedes ejecutar el servidor tú mismo siguiendo las instrucciones anteriores.

Configuración del IDE​

Extensiones de lint/formato​

Configurar estas extensiones en el IDE mejora la experiencia del desarrollador, formateando automáticamente el código al guardar y proporcionando comentarios instantáneos sobre problemas de lint.

Métricas de código Dart​

La aplicación móvil utiliza DCM (Métricas de Código Dart) para análisis de código y cálculo de métricas. Consulta la página Inicio rápido para más información sobre cómo configurar DCM.

Nota: No es necesario activar la licencia.

VSCode​

Instala las extensiones Flutter, DCM, Prettier, ESLint y Svelte. Estas extensiones están listadas en el archivo extensions.json ubicado en .vscode/ y deberían aparecer como recomendaciones del espacio de trabajo.

Aquí están las configuraciones que usamos, deberían estar activas como configuraciones del espacio de trabajo (settings.json):

settings.json
{
  "[css]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[dart]": {
    "editor.defaultFormatter": "Dart-Code.dart-code",
    "editor.formatOnSave": true,
    "editor.selectionHighlight": false,
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.suggestSelection": "first",
    "editor.tabCompletion": "onlySnippets",
    "editor.wordBasedSuggestions": "off"
  },
  "[javascript]": {
    "editor.codeActionsOnSave": {
      "source.organizeImports": "explicit",
      "source.removeUnusedImports": "explicit"
    },
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[svelte]": {
    "editor.codeActionsOnSave": {
      "source.organizeImports": "explicit",
      "source.removeUnusedImports": "explicit"
    },
    "editor.defaultFormatter": "svelte.svelte-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "[typescript]": {
    "editor.codeActionsOnSave": {
      "source.organizeImports": "explicit",
      "source.removeUnusedImports": "explicit"
    },
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true,
    "editor.tabSize": 2
  },
  "cSpell.words": ["immich"],
  "editor.formatOnSave": true,
  "eslint.validate": ["javascript", "svelte"],
  "explorer.fileNesting.enabled": true,
  "explorer.fileNesting.patterns": {
    "*.dart": "${capture}.g.dart,${capture}.gr.dart,${capture}.drift.dart",
    "*.ts": "${capture}.spec.ts,${capture}.mock.ts"
  },
  "svelte.enable-ts-plugin": true,
  "typescript.preferences.importModuleSpecifier": "non-relative"
}