Etiquetas

De web a app: Transforma tu proyecto PHP8/CodeIgniter 4 en una aplicación de escritorio





 Amplía el alcance de tu aplicación PHP8/CodeIgniter 4 y llévala a los escritorios de tus usuarios. Aprende a empaquetar tu aplicación para Windows, macOS y Linux, y aprovecha las características nativas de cada plataforma.

Vamos a mostrar cómo convertir una aplicación web a una aplicación de escritorio usando ElectroJS

Para todo eso es necesario tener todo lo siguiente ya instalado
● Git, puede ser Git GUI

Primero clonamos el repositorio con el siguiente codigo


1
git clone https://github.com/electron/electron-quick-start.git


En el archivo package.json lo dejamos de la siguiente manera




 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
{

    "build": {
        "appId": "com.electron.example",
        "compression": "maximum"
    },
    "name": "XML2PDF CFDI",

    "version": "2.0.0",

    "description": "Una pequeña aplicación para convertir el CFDI XML a PDF",

    "main": "main.js",

    "compression": "maximum",

    "scripts": {

        "***": null,
        "pro:windows": "electron-builder --win"
    },
    "repository": "https://github.com/electron/electron-quick-start",  

    "keywords": [
        "CFDI",
        "XML",
        "PDF",
        "tutorial"
    ],
    "author": "Julio Cesar Leyva Rodriguez",
    "license": "CC0-1.0",
    "devDependencies": {
        "electron": "^21.2.3",
        "electron-builder": "^22.14.13",
        "electron-packager": "^17.1.1"
    },
    "dependencies": {
        "modclean": "^3.0.0-beta.1"
    }
}


en main.js lo dejamos haci lo que hara es cargar la url y levantar el servicio de php



  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
// Modules to control application life and create native browser window

	const {app, BrowserWindow} = require('electron')

	const path = require('path')

	const exec = require('child_process').exec;

	  
	  

	function execute(command, callback) {

	exec(command, (error, stdout, stderr) => {

	callback(stdout);

	});

	};

	  
	  

	// call the function

	execute('Ejecutar.bat', (output) => {

	console.log(output);

	});

	  

	function createWindow () {

	// Create the browser window.

	const mainWindow = new BrowserWindow({

	width: 800,

	height: 600,

	webPreferences: {

	preload: path.join(__dirname, 'preload.js')

	}

	})

	  

	// and load the index.html of the app.

	mainWindow.setMenu(null)

	mainWindow.loadURL('http://localhost:8097')

	  

	// Open the DevTools.

	// mainWindow.webContents.openDevTools()

	}

	  

	// This method will be called when Electron has finished

	// initialization and is ready to create browser windows.

	// Some APIs can only be used after this event occurs.

	app.whenReady().then(() => {

	createWindow()

	  

	app.on('activate', function () {

	// On macOS it's common to re-create a window in the app when the

	// dock icon is clicked and there are no other windows open.

	if (BrowserWindow.getAllWindows().length === 0) createWindow()

	})

	})

	  

	// Quit when all windows are closed, except on macOS. There, it's common

	// for applications and their menu bar to stay active until the user quits

	// explicitly with Cmd + Q.

	app.on('window-all-closed', function () {

	if (process.platform !== 'darwin') app.quit()

	})

	  

	// In this file you can include the rest of your app's specific main process

	// code. You can also put them in separate files and require them here.





Ahora posicionados en la carpeta \electron-quick-start> corremos el siguiente comandonpm install


Después creamos el paquete-ejecutable con el siguiente comando

electron-packager . -platform=win32 -arch=x64 ConversorXMLPDF



Y nos genera los archivos necesarios



Creamos una carpeta en C: llamada aplicación o como ustedes quieran llamarle y copiamos el contenido, la carpeta del proyecto del codeigniter y los archivos ejecutable de PHP con los que trabajan, pueden copiar los del xampp y con el que debugean a través de netbeans

quedaría de la siguiente forma



ConvertidorXMLPDF seria el proyecto en codeigniter, php8 son los binarios necesarios para ejecutar código php, este lo pueden extraer de xampp y lo demas son los archivos de electronJS

Ahora en el archivo de configuración de código igniter en config/app.php en la base URL la dejamos asi

public $baseURL = '[http://localhost:8097/)';



El archivo Ejecutar.bat es el que va iniciar todo el codeigniter y dentro de el va el siguiente código

@echo off 
 php8\php.exe convertidorXMLPDF/spark serve --port 8097



El archivo Ejecutar.bat se ejecuta automáticamente al abrir el ejecutable

Y listo ahora solo queda hacer el instalador, pero lo dejamos para otro manual.
Etiquetas:

Comentarios

Publicar un comentario

Entradas populares