Web Development Code Examples

Creating Sites and Apps using Code and APIs


Sample Coding Projects

Code deliverables banner.

This page provides samples of various HTML, CSS, JavaScript, PHP coding projects. In particular, they showcase coding without frameworks or libraries.


WebVR-Mini

WebVR-Mini - a WebVR JavaScript Framework

A complete WebGL and WebVR framework, authored without any libraries or framework. Creates all the code needed to load 3D models in a variety of formats, including GLtF format. Uses and XML file to define the organization of the 3D environment and place objects. Add 2D UI elements for controlling loaded models and scenes. Direct and complete support for the WebVR JavaScript API (a subset of the newer WebXR API) for virtual reality headsets.

Short video demonstrating WebVR-Mini loading sample worlds.


Plutonian XR stellar simulation

PlutonianXR Flythrough

Simulation of the real positions, sizes and colors of the nearest 117,000 stars, taken from multiple stellar databases. Plutonian allows the user to fly through the local space (around 1000 light years). A few systems (the Sun, Alpha Centauri) show additional detail. Works in 3D on your desktop, or in VR headsets (Windows MR or Oculus). Be as a god, walking among the stars...

The back-end code can dynamically scan stellar spectra, and compute the likely color and size and type of each star.

Short video demonstrating PlutonianXR.


WebVR Planetary Simulation with BabylonJS

WebVR BabylonJS Planet Simulation

A planetary simulation, authored for WebVR/WebXR using the BabylonJS game engine. Implements texture loading, program 3D model generation, orbital motion, and access to virtual reality simulation using the WebVR JavaScript API. Shows the great features of the BabylonJS library for building WebXR and 3D browser simulations in general.

Short video demonstrating the BabylonJS WebVR app.


Elefart HTML5 Game

An HTML5 Game concept, developed from scratch without libraries or frameworks. Uses the Canvas API to generate 2D scenes and animation. Adaptive (meaning that the game automatically resizes to different screen sizes). Gameplay implements an elevator model for "levels" - a system that is harder to create than it looks.

Short video demonstrating Elefart gameplay.



Related pages: UX Deliverables | Language Learning App | More Projects