Skip to content

INSTRUCCIONES BÁSICAS

Jump to bottom
Rob Vivo edited this page Jun 10, 2022 · 11 revisions

Motivación

Para construir aplicaciones gráficas 3D sobre web vamos a utilizar la biblioteca Three.js sobre el API de WebGL. Dada la constante evolución de Three.js necesitamos fijar una release para compatibilizar el código.
Usaremos Three.js r140, una versión anterior a la actual, para la que se ha comprobado el correcto funcionamiento del código que se suministra y la adecuación a la documentación usada en la asignatura.

Contenido del proyecto

Este proyecto contiene lo siguiente:

  • Las bibliotecas básicas compatibles con Three.js r140 en la carpeta lib
  • Algunos media en las carpetas images y videos
  • Algunos modelos externos en models
  • Código javascript de ayuda para el trabajo directo con WebGL y Threejs en la carpeta js
  • Código html de carga de página de la aplicación de test

Este proyecto no contiene:

  • La documentación relativa a la versión Three.js r140. Para acceder a esa documentación (y al código en general) debe entrar en el proyecto Three.js y seleccionar el tag r140. Opcionalmente puede clonar el proyecto en local.

Objetivo

El objetivo de este proyecto es servir como plantilla de cada uno de los proyectos que se vayan a realizar con Three.js r140 y GitHub Pages

Modo de empleo

Para utilizar este proyecto como plantillas procederemos así:

  1. Crear una cuenta en GitHub si no disponemos de ella -> https://github.com/micuenta
  2. Crear un proyecto de GitHub Pages vacío siguiendo las instrucciones -> https://github.com/micuenta/micuenta.github.io
  3. Clonar este proyecto y el propio en local
$ cd ~user/repos
$ git clone https://github.com/RobVivo/RobVivo.github.io.git 
$ git clone https://github.com/micuenta/micuenta.github.io.git
  1. Copiar el contenido del proyecto RobVivo.github.io a micuenta.github.io y subir al repositorio
$ cp -r RobVivo.github.io/* micuenta.github.io
$ cd micuenta.github.io
$ git add --all
$ git commit -m "Initial load"
$ git push origin
  1. Comprobar que todo funciona
    Abrir el navegador y escribir la URL https://micuenta.github.io
    Se debe ver un cubo RGB girando con símbolos en las caras que se puede manipular con el ratón.
  2. Incorporar código propio
    Hay dos opciones: trabajar en local y subir los cambios al repositorio o trabajar directamente sobre el repositorio en github. En cualquier caso, si por ejemplo se ha incorporado la nueva página proyecto.html a la raíz del proyecto, la URL de carga es https://micuenta.github.io/proyecto.html

Resumen

En este documento se explica cómo cargar un proyecto con las bibliotecas básicas de Three.js r140 y cómo crear una nueva página de carga de una aplicación web 3D propia usando el servidor de GitHub Pages.

Clone this wiki locally