Bootstrap Hello World

NetBurner Bootstrap HelloWorld Example

Overview

The Bootstrap HelloWorld Example demonstrates how to utilize Twitter Bootstrap ( http://twitter.github.io/bootstrap/ ) on a NetBurner device. This example loads a simple "Hello World" web page on to the device, along with the Twitter Bootstrap framework (version 4.0).

Application Description

The main application (main.cpp) creates a minimal web server that:

• Initializes the NetBurner network stack
• Enables system diagnostics for debugging
• Starts an HTTP web server on the default port (80)
• Waits for DHCP network configuration
• Displays application information and NNDK revision via serial output
• Runs continuously with a 1-second delay loop

Key Features

Embedded Application (main.cpp)

• Network Stack Initialization: Automatically configures network connectivity
• Web Server: Built-in HTTP server for serving web content
• DHCP Support: Automatic IP address assignment
• System Diagnostics: Debug information output
• Real-time Operation: Uses NBRTOS for task scheduling

Web Interface (index.html)

• Bootstrap Framework: Modern, responsive web design
• Image Carousel: Interactive slideshow showcasing NetBurner products
• Responsive Design: Adapts to different screen sizes
• Professional Styling: Clean, marketing-focused layout

Hardware Compatibility

Based on the web interface images, this application supports NetBurner development boards including:

• NANO54415 series
• Serial2Ethernet modules
• Other NetBurner embedded modules

Development Environment

• IDE: NetBurner's customized Eclipse-based development environment
• Platform Support: Both Mac and PC development
• Build System: One-click compile, link, and load process
• Web Assets: HTML, CSS, and JavaScript files served directly from the embedded device

File Structure

project/
 main.cpp              # Main application source code
 index.html            # Web interface homepage
    assets/               # Web assets (referenced in HTML)
        css/             # Bootstrap CSS files
        js/              # JavaScript libraries
        img/             # Product images and screenshots

Getting Started

1. Development Setup: Install NetBurner's Eclipse-based IDE
2. Hardware Connection: Connect your NetBurner module to the network
3. Project Build: Use the IDE's one-click build process
4. Deployment: Load the application onto your NetBurner device
5. Access: Navigate to the device's IP address in a web browser

Application Flow

1. Device boots and initializes the network stack
2. HTTP server starts on port 80
3. Device acquires IP address via DHCP
4. Application information is displayed via serial output
5. Web interface becomes accessible at the device's IP address
6. Main application loop continues indefinitely

Web Interface Features

• Welcome Message: "Hello World. It's that easy."
• Product Showcase: Carousel displaying NetBurner development tools
• Development Information: Details about the Eclipse-based IDE
• Cross-platform Support: Information about Mac and PC compatibility

Technical Details

• Operating System: NetBurner RTOS (NBRTOS)
• Network Protocol: HTTP/TCP
• Frontend Framework: Bootstrap 4.x
• JavaScript Libraries: jQuery 3.3.1, Bootstrap Bundle
• Styling: Bootstrap grid system and components

Use Cases

This example serves as a foundation for:

• IoT device web interfaces
• Embedded system monitoring dashboards
• Remote device configuration portals

Next Steps

This basic example can be extended with:

• REST API endpoints
• Real-time data visualization
• Device configuration interfaces
• Sensor data collection and display
• Remote control capabilities