Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube
JC Mouse Bolivia
Index / Firebase / Hola Mundo con Firebase

Hola Mundo con Firebase

Autor jc mouse domingo, enero 28, 2018

Firebase es la plataforma para el desarrollo de aplicaciones web y aplicaciones móviles de Google el cual se centra en el desarrollo del Back-End de nuestras aplicaciones con una base de datos en tiempo real, documentación en español y varias librerías que nos facilitan el trabajo de interacción con la base de datos desde app en Android, javascript, IOS, etc. Ademas cuenta con un sistema de autenticación (twitter, facebook, github, correo electronico) y hosting de archivos.

En este post desarrollaremos paso a paso la creación de una cuenta en Firebase hasta el tipico “Hola Mundo” que no puede faltar en los post de introducción a la programación, para terminar implementamos un pequeño código para leer datos de firebase desde una aplicación en lenguaje java.

Necesitamos:

  • Cuenta de GMail
  • Navegador Web (Chrome o Firefox)
  • Insomnia REST Client (opcional)
  • Conocimientos sobre JSON

Paso 1: Cuenta en Firebase

Nuestro primer paso es crear una cuenta para Firebase, escribimos https://firebase.google.com en el navegador de tu preferencia e ingresamos a la plataforma con nuestra cuenta de GMail.

firebase page

Una vez logueados, ingresamos a la consola “IR A LA CONSOLA” donde podremos ver los proyectos que tengamos registrados en Firebase.

Paso 2: Crear un nuevo proyecto

Dentro nuestra consola, presionamos el botón con el signo (+) que dice “Añadir proyecto

add project

Se despliega una ventana donde ingresaremos los siguientes datos:

  • Nombre del Proyecto: “Proyecto Valkyria
  • ID del Proyecto: “proyecto-valkyria“. Se genera automáticamente y es el Identificador Único de tu proyecto, seria similar a tu DNI que te identifica entre todos los habitantes de tu país. Para este ejemplo tuvimos suerte y tanto el Nombre del Proyecto como el ID se parecen y eso es bueno, pero existiendo miles y miles de proyecto te encontraras con casos en que el nombre de proyecto ya existe y por tanto se generan IDs como “proyecto-val123bh-asaas“, pero presionando el icono con forma de lápiz, podrás escribir y personalizar tu propio ID.
  • Pais/Región: “Bolivia“. Nada que decir, solo selecciona tu país

Operacion Valkyria

Para terminar presiona el botón “CREAR PROYECTO” y espera unos momentos a que termine el proceso de creación. Cuando termine te mostrar el panel de desarrollador por donde podrás navegar por todas las herramientas y opciones con la que cuenta Firebase.

desarrollador bolivia

Paso 3: Nuestra Base de Datos

Presiona la opción del menú que dice “Database” y a continuación el botón “EMPEZAR” para desplegar el panel de administración de la Base de Datos JSON

base de datos en tiempo real

En esta sección podemos distinguir lo siguiente:

  • A) El nombre de nuestro proyecto actual, haciendo clic sobre este, podemos cambiar de proyecto.
  • B) Por defecto nos encontramos en la pestaña “DATOS” donde podemos interactuar directamente con nuestra datos, veremos un ejemplo más adelante.
  • C) A lado de “DATOS” tenemos la pestaña “REGLAS” donde podemos establecer las reglas para la lectura y escritura de nuestra base de datos. Por defecto las reglas de seguridad requieren que los usuarios estén autenticados. Veremos como podemos cambiarlas más adelante.
  • D) Es la URL raíz de nuestro proyecto, a partir de este podremos ir navegando por los diferentes datos que tengamos.
  • E) Es la raíz de nuestro árbol de datos, aquí los datos se van creando y dividiéndose como las ramas y hojas de un árbol
  • F) Finalmente, tenemos un pequeño menú donde las opciones más importantes por el momento son las de Exportar e Importar JSON

Paso 4: Los Datos

Para agregar datos manualmente, nos posicionamos en la raíz y presionamos el botón [+]Add child“, aparece lo siguiente:

estructura json

Esta es la sintaxis JSON la cual se divide en Nombre y Valor y se separan por dos puntos “:”, es decir:

  • Nombre: Es el nombre que identifica un recurso. Si se usaran mas de 2 palabras, de preferencia no usar espacios sino un guion bajo o en su defecto unir las palabras con Mayúsculas (Ej. Mis_Datos, MisDatos)
  • Valor: El cual puede ser de tipo numerico, string, boolean, array incluso otro objeto json

Los datos que colocaremos son los siguientes:

  • Nombre: Saludo
  • Valor: Hola Mundo Cruel!!!

Para grabar los datos, clic en el botón “AÑADIR” y tenemos:

hello world

Con ese mismo procedimiento podemos ir agregando más datos, incluso anidados. Inténtalo que echando a perder se aprende 🙂

database json

Paso 5: Lectura de datos y definición de Reglas

Para visualizar los datos usaremos la app Insomnia, si no lo tienes, puedes usar un navegador web como Chrome por ejemplo.

Para crear la URL de nuestro recurso, unimos la URL raíz del proyecto + el nombre del recurso seguido de un “.json”, es decir

https://proyecto-valkyria.firebaseio.com/ + Saludo + .json

tenemos:

https://proyecto-valkyria.firebaseio.com/Saludo.json

Ahora, crea una nueva solicitud GET en Insomnia y escribe la URL https://proyecto-valkyria.firebaseio.com/Saludo.json .Presiona el botón “Send” enviar.

Permiso Denegado

Recibimos un mensaje con código 401 unauthorized “Permiso denegado“, es decir que para acceder a los datos debemos estar autenticados en la aplicación. Esto sucede porque al crear la app de Firebase por defecto se establece las reglas de seguridad que no permiten la lectura y escritura a usuarios anónimos.

Podemos modificar las reglas de acceso en cualquier momento según lo requiera nuestra aplicación para ello, presiona la pestaña “REGLAS“, en esta sección puedes observar lo siguiente:

reglas malditas

Esta configuración nos dice que el quiera interactuar con los datos tanto para la lectura “.read” como la escritura “.write” de todo el árbol de datos, debe estar debidamente autenticado. Modificaremos las reglas para permitir que los datos sean públicos, es decir, que cualquiera podrá “ver” los datos de nuestra aplicación, para esto escribimos “true” en .read y presionamos el botón “PUBLICAR” es decir:

anarquia 2018

Volvemos a nuestro cliente REST y enviamos la solicitud nuevamente:

a todo gas 200

Esta vez obtenemos como respuesta el código 200, es decir, la solicitud tuvo éxito y ya podemos visualizar nuestro saludo “Hola Mundo Cruel!!!”.

De la misma forma, realizamos la solicitud para el recursos “Autor” y tenemos:

cliente rest firebase

Si estas usando un navegador web para realizar las peticiones, añade a la solicitud el comando “?print=pretty” es decir “https://proyecto-valkyria.firebaseio.com/Autor.json?print=pretty” esto imprimirá el resultado con formato legible.

i feel pretty

Para terminar

Para finalizar este post, implementamos una clase en lenguaje java para leer los datos del servidor de firebase:

import java.io.BufferedInputStream;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
/**
 * @see http://www.jc-mouse.net/
 * @author mouse
 */
public class Main {
    
    public static void main(String[] args) {        
        try {
            URL url = new URL("https://proyecto-valkyria.firebaseio.com/Autor.json?print=pretty");
            HttpURLConnection connection = (HttpURLConnection) url.openConnection();
            connection.setRequestMethod("GET");
            connection.setRequestProperty("User-Agent", "Mozilla/5.0");
            connection.setRequestProperty("Accept-Language", "en-US,en;q=0.5");
            connection.setRequestProperty("Content-Type", "application/json");            
            switch (connection.getResponseCode()) {
                case HttpURLConnection.HTTP_OK: //Codigo 200
                    StringBuilder resultado = leer(connection);
                    System.out.println("resultado JSON: " + resultado.toString());
                    break;
                default:                    
                    System.out.println("Codigo Respuesta: " + connection.getResponseCode());
                    break;
            }
        } catch (MalformedURLException ex) {
            System.err.println("MalformedURLException: " + ex.getMessage());
        } catch (IOException ex) {
            System.err.println("IOException: " + ex.getMessage());
        }

    }

    /**
     * Lee respuesta del servidor
     */
    public static StringBuilder leer(HttpURLConnection conn) throws IOException {
        StringBuilder stringBuilder = new StringBuilder();
        InputStream in = new BufferedInputStream(conn.getInputStream());
        BufferedReader reader = new BufferedReader(new InputStreamReader(in));
        String line;
        while ((line = reader.readLine()) != null) {
            stringBuilder.append(line).append("\n");
        }
        return stringBuilder;
    }

}

y obtenemos como resultado

netbeans firebase

enjoy!!!

Tags

Si te ha gustado podrías compartirlo o dejar un comentario. ¡Muchas gracias!
Autor: JC Mouse

Yo soy yo :) JC Mouse, Soy orgullosamente boliviano soy fundador y CEO de la web jc-Mouse.net uno de las pocas web en emprendimiento y tecnología en Bolivia.

Toda la información que encuentres en este sitio es y sera completamente gratis siempre, puedes copiar, descargar y re-publicar si así lo deseas en otros blogs o sitios web, solo te pido a cambio que dejes una referencia a esta web. Esto nos ayuda a crecer y seguir aportando. Bye

Enjoy! :)

También Te Podría Interesar

Cliente/Servidor en java y c#

Cliente/Servidor en java y c#

Como habíamos mencionado en un anterior post Ejemplo socket java Cliente/Servidor , el lenguaje de programación entre el...

Contraseñas con emojis en java

Contraseñas con emojis en java

Semanas atrás leí un articulo en el que se pensaba implementar los emojis como contraseñas en los dispositivos con andro...

Actualizar JComboBox al cambiar valor de otro JComboBox

Actualizar JComboBox al cambiar valor de otro JComboBox

Cuando se trabaja con base de datos, estos datos son dinámicos, cambian con el tiempo y es necesario que esos cambios se...

Estilos condicionales en iReport

Estilos condicionales en iReport

iReport nos da la posibilidad de dar un formato condicional a los diferentes registros resultado de nuestras consultas S...

Tabla para inventarios de Entradas y Salidas

Tabla para inventarios de Entradas y Salidas

A veces navegando en la internet buscando novedades , investigando o simplemente perdiendo el tiempo 🙂 se encuentran cos...

GridView con imagenes en miniatura

GridView con imagenes en miniatura

Entre las muchas aplicaciones que hay en la playstore de google están las galerías de fotos de chicas 🙂 que tantos nos e...

Comparte lo que sabes

Categorias

Últimas entradas

En este y un segundo post desarrollaremos un microservicio java utilizando el framework Spark que implementara las funci...

Oi galera, en esta oportunidad les traigo una curiosidad que encontré por casualidad perdiendo el tiempo en Internet, se...

Kotlin es un lenguaje de programación relativamente nuevo que ha ido ganando terreno en el desarrollo de aplicaciones pa...

Kotlin es un lenguaje de programación de tipado estático que corre sobre la máquina virtual de Java y que también puede...

Android Bolivia

MAUS