Blog

Como instalar NGinx en Windows y Mac OS Blog

Tags: nginx desarrollo

Para la mayoría de los cursos que tenemos en este sitio se necesita tener instalado un servidor web, en este tutorial voy a mostrar como instalar un Servidor NGinx en Windows y Mac OS X.

Instalar NGINX en Windows

Para instalar NGinx en windows solo tienes que ir a la página de descarga del sitio oficial y descargar la versión para windows, la más reciente al día de hoy es nginx/Windows-1.7.7

Luego simplemente descomprimes el zip y ejecutas el nginx.exe y listo, así de sencillo. Con eso tendrás ya instalado tu servidor y listo para iniciar, todo lo que esté dentro de la carpeta html será lo que NGinx podrá servir, aquí es donde debes colocar todos los archivos que quieras ver en tu navegador.

Si abres tu navegador en http://localhost verás la página de bienvenida de NGinx.

Instalacin del NGinx

Instalación del NGinx

Instalación en MAC OS

Para instalarlo en Mac OS también es muy sencillo, es necesario tener instalado homebrew, que es un administrador de paquetes para Mac, muy recomendado para instalar software de manera sencilla. Para instalar NGinx solo tienes que ejecutar el siguiente comando en la terminal.

$ brew install nginx

Una vez instalado, puedes prenderlo con el siguiente comando.

$ sudo nginx

Y listo, al abrir el navegador e ir a http://localhost:8080 deberíamos ver la página de bienvenida de NGinx. Algo importante por mencionar es que debemos agregar todo nuestro código de este curso en /usr/local/Cellar/nginx/1.6.2/html, ya que aquí es donde NGinx servirá nuestros archivos. 

Instalacin del NGinx

Instalación del NGinx

Configuración del NGINX

Estos pasos son exactamente los mismos para configurar el NGinx en Windows, Mac o Linux. En primer lugar vamos a cambiar el folder donde NGinx va a servir los archivos y assets que usaremos en nuestro juego, para eso abrimos el archivo de configuración y modificamos lo siguiente.

Windows: nginx-folder/conf/nginx.conf
Mac: /usr/local/etc/nginx/nginx.conf

location / {
    root   EL_PATH_QUE_QUIERAS;
    index  index.html index.htm;
}

Cerca de la línea 43 encontrarás la configuración root, aquí es donde vamos a definir la ruta donde queremos que NGinx lea los archivos a servir, en mi caso usaré /Users/Crysfel/Workspace, pero puedes usar cualquier otro. 

location / {
    root   /Users/Crysfel/Workspace;
    index  index.html index.htm;
}

Personalmente prefiero poner el webroot en algún folder dentro de mi Home para no tener problemas de permisos, pero realmente puedes apuntar esta propiedad a cualquier folder, solo ten cuidado que archivos expones, ya que cualquiera en tu misma LAN tendrá acceso de lectura a esos archivos. 

Ahora vamos a cambiar el puerto, en Windows por defecto está usando el puerto 80, pero en Mac utiliza el 8080, para cambiar el puerto modificamos la siguiente configuración.

server {
    listen       80;            #<------
    server_name  localhost; 
 
    #.....

}

La configuración listen es la que nos interesa cambiar, en este caso voy a cambiar al puerto 80, con esto ya no será necesario especificar el puerto en el navegador (http://localhost).

403

Cambiando el webroot

Por último vamos a habilitar al NGinx para que liste los directorios, actualmente si accedemos a un directorio donde no tiene un archivo index.html NGinx nos retorna un error 403, que significa que no tenemos permisos para listar los archivos en el directorio actual, esto es genial para ambientes de producción, pero para desarrollo no es lo ideal.

Vamos a cambiar la siguiente configuración para listar archivos en el directorio.

location / {
    root   /Users/Crysfel/Workspace;
    autoindex on;        #<-------
    index  index.html index.htm;
}

Justo donde modificamos la configuración root, vamos a agregar una nueva configuración llamada autoindex on, con esto podremos listar el contenido de cualquier directorio.

Listando folders

Listando folders

Mi archivo de configuración ha quedado de la siguiente manera.

#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;

        location / {
            root   /Users/Crysfel/Workspace;
            autoindex on;
            index  index.html index.htm;
        }
    }

}

Ahora si, estamos listos para desarrollar! Ya tenemos nuestro servidor web instalado.

Happy Coding! 

1Comentario

Instructor del curso

Crysfel3

Autor: Crysfel Villa

Soy un geek que disfruta crear y compartir cosas en internet! Sígueme en twitter @crysfel