Bitbucket

Bitbucket es un servicio de alojamiento basado en web, para los proyectos que utilizan el sistema de control de revisiones Mercurial y Git. Bitbucket ofrece planes comerciales y gratuitos. Se ofrece cuentas gratuitas con un número ilimitado de repositorios privados desde septiembre de 2010. - Wikpedia

Bitbucket nos servirá como servicio gratuito para el alojamiento de código fuente de los programas-proyectos que realicemos, de manera pública.

Para lo anterior de forma general llevarás a cabo lo siguiente:

  1. Obtendrás una cuenta en Bitbucket.
  2. Configurarás tu entorno con los datos de tu cuenta en Bitbucket.

Creación de cuenta en Bitbucket

Crea una cuenta de usuario en Bitbucket accediendo a https://bitbucket.org/account/signup/, tomando en cuenta lo siguiente:

  1. Email address: tu correo electrónico.
  2. Full name: tu nombre completo.
  3. Username: será tu nombre de usuario para acceder a Bitbucket.
  4. Password: será tu contraseña para acceder a Bitbucket.

IMPORTANTE:

  • Tu nombre de usuario (username) de Bitbucket debe seguir el siguiente patrón: ApellidoPaternoApellidoMaternoNombres

    Como ejemplo mi nombre de usuario sería HernandezBlasAntonio.

  • Al momento de ser creada tu cuenta Bitbucket te hará llegar un correo electrónico para confirmar la creación de la misma, verificando tu correco electrónico (Verify my email address).

  • Accede a Bitbucket con tu cuenta de usuario, dirigete a Manage Atlassian account (menu desplegable ubicado en la parte superior derecha con una imagen en blanco) y modifica tu avatar (Change avatar) con una foto personal tamaño infantil, la más reciente que encuentres.

  • Si todo ha salido bien contarás con una página de perfil, igual que en el punto anterior pero accede a View profile.

    Como ejemplo mi página de perfil sería https://bitbucket.org/HernandezBlasAntonio.

Trabajando con Bitbucket y Git

A continuación se darán los pasos para hospedar una página web personal en Bitbucket (https://pages.bitbucket.io), todo esto conlleva que se configure nuestro entorno de trabajo (línea de comandos en el sistema operativo). Por otro lado también servirá para plantear la forma de trabajar con un sistema de control de revisiones como Git.

Al finalizar se dan las instrucciones para integrar el servicio de comentarios ofrecido por Disqus a tu página web personal creada en Bitbucket.

Realiza los siguientes pasos en Bitbucket:

  1. Accede con tu cuenta de Bitbucket a https://bitbucket.org/repo/create para crear un repositorio.

  2. Rellena el formulario que se te presenta tomando en cuenta lo siguiente:

    • Repository name: es el nombre de tu repositorio. El valor aquí ingresado es tu nombre de usuario en Bitbucket seguido de bitbucket.org, todo en minúsculas.

      Por ejemplo, mi nombre de usuario en Bitbucket es HernandezBlasAntonio y el valor ingresado ha sido: hernandezblasantonio.bitbucket.org.

    • Access level: desactiva esta opción para que sea un repositorio público.

      Si dejas activada esta opción tu repositorio será un repositorio privado. Cualquier otro usuario puede acceder al contenido de un repositorio público mientras que a un repositorio privado solo tu y los usuarios a quienes les des permisos podrán hacerlo.

    • Repository type: selecciona Git

    Las opciones dentro de Advanced settings (opcionales) son:

    • Description: una descripción del contenido de tu repositorio.
    • Project management: para contar con un gestor/rastreador de problemas (Issue tracking) y una Wiki.
    • Language: se refiere al lenguaje de programación principal que almacenarás en tu repositorio.

    Una vez que hayas dado clic en Create repository se te enviará a la página principal de tu repositorio (Overview):

    • https://bitbucket.org/NombreDeUsuario/nombredeusuario.bitbucket.org
  3. Crea el directorio $HOME/www y dentro de él ejecuta lo siguiente para clonar (copiar) el repositorio remoto, el repositorio que creaste en el 2o. paso:

    alumno@servidor:~ $ mkdir $HOME/www
    alumno@servidor:~ $ cd $HOME/www
    alumno@servidor:~/www $ git clone https://bitbucket.org/NombreDeUsuario/nombredeusuario.bitbucket.org
    Cloning into 'nombredeusuario.bitbucket.org'...
    Checking connectivity... done
    

En este momento tu directorio local $HOME/www/nombredeusuario.bitbucket.org es una copia exacta del directorio remoto (https://bitbucket.org/NombreDeUsuario/nombredeusuario.bitbucket.org). Realmente nunca les llamaremos directorios si no más bien repositorios, local o remoto según sea el caso.

Ahora bien, realiza lo siguiente para agregar contenido a tu página web personal:

  1. Accede a $HOME/www/nombredeusuario.bitbucket.org(de aquí en adelante solo le llamaré repositorio local) y crea el archivo index.html con el siguiente contenido:

     <!DOCTYPE html>
       <head>
         <meta charset="UTF-8">
         <title>Inicio</title>
       </head>
       <body>
         <h1>Bienvenido</h1>
       </body>
     </html>
    
  2. Indicale a Git que determine las modificaciones hechas dentro del repositorio local con el comando git add -A.

    alumno@servidor:~/www/nombredeusuario.bitbucket.orf $ git add -A
    
  3. Identifica tus últimas modificaciones con un mensaje realizando un commit con el comando git commit -a -m "MENSAJE":

    alumno@servidor:~/www/nombredeusuario.bitbucket.org $ git commit -a -m "Primer commit :)"
    [master (root-commit) 21b82c5] Primer commit :)
     1 file changed, 0 insertions(+), 0 deletions(-)
     create mode 100644 index.html
    

    En caso de que no uses la opción -m de Git el editor de texto nano se abrirá para que escribas el mensaje.

    Nota: los mensajes que escribas podrás visualizarlos en la página principal de tu repositorio por lo que te será de ayuda escribir un mensaje claro y descriptivo de las modificaciones.

  4. Envía tus ultimas modificaciones hechas en tu repositorio local a tu repositorio remoto con el comando git push:

    alumno@servidor:~/www/nombredeusuario.bitbucket.org $ git push -u origin master
    Username for 'https://bitbucket.org': NombreDeUsuario
    Password for 'https://NombreDeUsuario@bitbucket.org': 
    Counting objects: 3, done.
    Writing objects: 100% (3/3), 228 bytes | 0 bytes/s, done.
    Total 3 (delta 0), reused 0 (delta 0)
    To https://bitbucket.org/NombreDeUsuario/nombredeusuario.bitbucket.org
     * [new branch]      master -> master
    Branch master set up to track remote branch master from origin.
    

    Nota: en este paso se te solicitará tu usuario (Username) y contraseña (Password) de Bitbucket.

Al finalizar tanto tu repositorio local como tu repositorio remoto se encuentran sincronizados por lo que puedes acceder a tu página web personal en: http://nombredeusuario.bitbucket.io. Por otro lado recomiendo que visites la página principal de tu repositorio y navegues en ella.

Actualizaciones

A partir de este momento para actualizar tu página web personal en Bitbucket realizas los siguientes pasos:

  1. Modificas tu repositorio local: agregando/editando/borrando archivos (de HTML, CSS, ímagenes, etc).
  2. Determinas las últimas modificaciones con Git: comando git add.
  3. Identificas tus últimas modificaciones con un mensaje: comando git commit.
  4. Envias tus modificaciones a tu repositorio remoto: comando git push.
  5. Regresas al paso 1.

Como puedes observar te encuentras en un ciclo de trabajo: del 5o. paso regresas al 1o.

Disqus

DISQUS es una plataforma con la que vamos a poder integrar en nuestra web un sistema de comentarios con el que permitir una mejor participación de nuestros usuarios. - Alvaro Martínez Guaita

  1. Obten una cuenta de usuario en Disqus accediendo a https://disqus.com/profile/signup/.

    Ante el formulario obtenido ingresa tu nombre personal (Name), tu correo electrónico (Email) y una contraseña (Password) a usar para tu cuenta de usuario en Disqus.

    Disqus te hará llegar al correo electrónico dado un mensaje solicitando que verifiques la existencia de tu correo electrónico.

  2. Accede a https://disqus.com/admin/create/ y ante el formulario obtenido ingresa tu nombre de usuario de Bitbucket en los campos Website Name y Shortname. Si tu página web personal se encuentra en http://nombredeusuario.bitbucket.io ingresa nombredeusuario-bitbucket-io en los campos anteriormente mencionados.

    Al terminar da click en el botón Next y serás llevado a https://nombredeusuario-bitbucket.io.disqus.com/admin/setup/, da click al botón Got it. Let's get started! y serás llevado a https://nombredeusuario-bitbucket-io.disqus.com/admin/settings/install/

  3. Ante las opciones bajo What platform is your site on? da click sobre Universal Code (al final).

    Serás llevado a https://nombredeusuario-bitbucket-io.disqus.com/admin/settings/universalcode/

  4. Bajo el texto Place the following code where you'd like Disqus to load: encontrarás código de HTML y JavaScript.

    IMPORTANTE: el código de HTML y JavaScript dado en esta parte es pegado en los documentos de HTML en los cuales se quiere ofrecer la oportunidad a terceras personas que dejen algún comentario dentro de tu página web personal.

    Dejo a continuación lo dado por Disqus:

     <div id="disqus_thread"></div>
     <script>
       (function() {
         var d = document, s = d.createElement('script');
         s.src = '//nombredeusuario-bitbucket-io.disqus.com/embed.js';
         s.setAttribute('data-timestamp', +new Date());
         (d.head || d.body).appendChild(s);
       })();
     </script>
     <noscript>
       Please enable JavaScript to view the
       <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a>
     </noscript>
    

    OBSERVACIÓN: el código de HTML y JavaScript aún contiene nombredeusuario-bitbucket-io, modifica esto de acuerdo a tu situación.

El código de HTML y JavaScript puedes integrarlo en cada uno de los documentos de HTML que formen parte de tu página web personal, dentro del elemento <body>.