7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

1/16

Universidad de HunucoSistemas Basados en el

Conocimiento

Instructor: Dr. Aland Bravo Vecorena

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

2/16

Herramientas de Desarrollo

PICDEM.netTM 2

PIC18F97J60

ENC28J60

Ethernet PICtailTM

PICDEM HPC 2

Explorer

Ethernet PICtail Plus

Explorer 16

PIC24, dsPIC, PIC32

DM163024

AC164121

AC164123

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

3/16

Acerca del Laboratorio

Objetivos del 1er Laboratorio:

Configurar la Tarjeta de Desarrollo Explorer 16

Direccin MAC

Nombre del Local Host Compilar y Cargar el TCP/IP Stack

Cargar Pginas Web desmostrativas

Pruebas de Conectividad

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

4/16

Acerca del Proyecto

Project Demonstration

Web Page Development

HTML Structure and Tags

Packaging Web Pages

Web-Enabled Vending Machine

Add network capabilities to existing design Build web page interface

Check stock

Set products and prices

Demonstration

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

5/16

Desarrollo de Pginas Web

Web Page Development

HTML Page content

CSS Style and layout

Other Components

GIF, JPG, PNG, JavaScript

Avoid visual editors (large code)

Definition

HTML: Hyper-Text Markup Language

CSS: Cascading Style Sheets

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

6/16

Acerca del Lenguaje HTML

HTML is a markup language

Use tags to indicate sections

Tags

are structural

wrap content

must be /closed

can be nested

may have attributes withvalues

content

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

7/16

Estructura HTML

All HTML documents have 3 tags

wraps entire document

is header content inside

is viewable content inside

Extra whitespace is ignored

Includes new lines

Case-insensitive Syntax is lenient

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

8/16

Etiquetas de Comentarios HTML

Common tags

wraps a paragraph

- creates headings

creates anchors (links) , , provide inline formatting

Visual elements within

creates a table creates a form

, create (un)ordered lists

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

9/16

Pgina Web Completa

My First Web Page

My First Web Page

Compared to assembly, HTML is

really easy!

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

10/16

Resultado Esperado

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

11/16

Empaquetando Pginas Web

Your Embedded

Application

MPFS2

Utility

EEPROMUsing

EEPROM?

Web Pages

yes

MPFS2 Utility

File system for embedded devices

Creates file system image

Uploads image to running application

Application programs to EEPROM

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

12/16

Configurar la Ruta de Libreras

(Proyecto N 1)

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

13/16

Laboratorio 2: Diseo de Pginas Web

Goals:

Create a simple web page

Test web page locally

Compile and upload MPFS2 image

Bonus:

Use CSS to formatyour page

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

14/16

Resultado Esperado

Very basic intro to HTML

Need to learn more? TLS8221!

In depth discussion on HTML

Detailed CSS formatting and layout techniques

Learn to create web page interfaces

TLS8221

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

15/16

Configurar la Ruta de Libreras

(Proyecto N 2)

7/27/2019 8.-Sistemas Basados en El Conocimiento-Laboratorio

16/16

Acerca del Curso

Presentacin en clase con PPT.

Laboratorio en Matlab, Proteus y MPLAB.

Proyectos de Investigacin:

SBC1: Espectro de Fourier de una Seal ECG. SBC2: Espectro Wavelet de una Seal ECG.

SBC3: Red Neuronal para Deteccin de Anomalas

Cardacas de una Seal ECG

SBC4: Deteccin de Segmento QRS de una Seal ECG.

Trabajos de Laboratorio:

Analizador ECG.

Controlador de Motor Trifsico.

Sistema de Estacin Meteorolgico.