Bitácora de Aprendizaje

Semana 1 Marzo 29 - Abril 4

Durante la primera semana, se realizo una introducción a la materia, y las directrices a seguir al momento de completar las asignaturas.

Para tener un mejor entendimiento de la materia, la primera asignación consistio en un pequeño cuestionario para medir nuestro conocimientos sobre la Web 2.0, el comercio electrónico y los diversos recursos informáticos (lenguajes de programación, softwares de desarrollo y CM) que sabemos utilizar.

Semana 2 Abril 5 - Abril 11

Discutimos en clase las diferentes respuestas que tuvimos del cuestionario de la tarea 1.

Se realizo la Tarea 2, que consistio en presentaciones en grupo de 3 personas, sobre los siguientes temas: Html, Css, Bootstrap y finalmente un resumen sobre los 3 temas.

Se nos explicaron los parametros a seguir para la creacion del portafolio para el final del semestre. El mismo debe realizarse a través de la herramienta Blogger. Tambien se hizo énfasis en la investigación de por lo menos 9 noticias sobre desarrollo web a lo largo del semestre.

Finalmente, empezo la presentacion del primer tema del semestre, El Comercio Electrónico. Se hizo mencion sobre las TICs, sus ventajas y desventajas.

Semana 3  Abril 12 - Abril 18

Culminamos el primer módulo del semestre, comercio electronico.

Que es ecomerce? Es el negocio electronico que se realiza mediante un medio electrónico y no de manera fisica

Se presento un video explicando que es el e commerce, desde el punto de vista de una gran empresa como lo es visa.

Tipos de e-commerce: Busines 2 consumer, busines 2 busines, consumer 2 consumer and consumer 2 business

La pandemia a causado un gran auge de hasta un 60% en el comercio electronico.

Se dio una segunda assignacion, "cms para la creacion de tiendas virtuales". Shopify es el tema de mi grupo.

Empezamos el segundo modulo: Tendencias del comercio electronico.

Las tendendicas del comercio electronico son la manera como las empresas establecen un vinculo comercial con los clientes a travez del internet. Las mas comunes son: tienda online, marketing de productos, AR, chatbots.

Los blogs son una alternativa mas barata si una compañia no tiene los recursos o necesita mas tiempo para crear su propia pagina web.

Semana 4  Abril 19 - Abril 25

Continuamos el tema del modulo 2, tendencias del comercio electronico.

Los chatbots son programas de inteligencia artifical que pueden sostener conversaciones con un cliente, principalmente utilizado para consultas o de mensajeria.

Mobile first commerce es la utilización de dispositivos móbiles como principal herramienta para realizar transacciones

Branding es el desarrollo de una marca en la mente de un consumidor.

E Branding es el cumulo de experiencias entre la compañia y los consumidores a traves del internet.

Se asigno la tarea 3, herramientas del marketing digital. mi grupo le toco google ads y adsense.

La seleccion de una plataforma es un paso importante al momento de desarrollarese en el comercio electronico.

Utilizar plataformas cms:

-cms exclusivo para e commerce: prestashop, magento, opencart y oscommerce

-cms +plugins e commerce: wordpress, woo commerce

-soluciones de pago en la nube: shopify

Crear pagina web desde cero:

-desarrollo frontend: html5, css3, bootstrap, javascript, jqueri, react

-desarrollo backend: php, xampp, apache, jason

Opciones de hosting:

-privado

-compartido

-free hosting

Base de datos: depende de la tecnologia y lenguajes de programacion utilizados

-mysql: esquema relacional + php + javascript + soporte sql

-maria db: esquema relacional + php + javascript + soporte sql

-mongo db: orietado a documentos + php + javascript + sql

Semana 5: Abril 26 - Mayo 2

Comenzamos el tema de:

Generalidades de Javascript en el desarrollo WEB

Pasos del desarrollo web

1-recopilacion de requerimientos

2-diseño de interfaces

3-programacion de interfaz de navegador

4-diseño de la base de datos

5-programacion del servidor

6-seleccion del servidor hosting

7-pruebas y mantenimiento

Que es un script? Es una serie de comandos que se pueden ejecutar sin necesidad de ser compilados

Lenguaje script es un tipo de lenguaje de programacion cuyo codigo se inserta en un documento html y puede ejecutarse sin ser compilado.

Tipos de datos primitivos: number, string, boolean y undefined.

Se realizo la presentacion de los diferentes temas de redes sociales:

-Facebook

-Instagram business

-Google Ads y Google Adsense

-Google analitics

Semana 6: Mayo 3 - Mayo 9

Continuamos la sintaxis y programación en javascript

Continuamos con ejemplos de lenguaje de javascript

Si javascript no esta abilitado, debe alertarse al usuario activarlo y mostrar instruccion como se hace

Cambios de valores de caracters numericos a string y viceversa.

Sentencias de control

estructuras condicionales:

-if

-switch

Continuamos con los ejemplos de programacion en javascript.

sentencias repetitivas:

-for

-while

Se asigno el laboratorio 2 como tarea.

Semana 7: Mayo 10 - Mayo 16

Realizamos una revision de los problemas del laboratorio 2.

Continuamos con el tema de javascript.

Definicion de funciones:

Palabra reservada function (con retorno y sin retorno)

Instruccion new(con retorno y sin retorno)

Objetos

Un objeto se define como una coleccion de propiedades y metodos agrupados en una estructura.

propiedades: relacion entre un nombre y un valor

metodos: es una funcion que puede ser llamada

Los objetos se inicializan con el uso de la palabra reservada var

ejemplo: var estudiante = {nombre: "pepe",apellido: "perez", edad: 22}

Manejo de funciones:

Se declaran con la palabra reservada function

sin retorno: funcion()

con retorno: funtion(var)

Llamado de funciones:

sin retorno: myFunction();

con retorno: var nombre = myFunction();

arrow function:

modo resumido de expresar funciones

sin retorno:

let myFunction = () =>{

//codigo

}

con retorno:

let suma =(a,b) => {

console.log(a + "es el primer valor")

return a+ b;

}

Semana 8: Mayo 17 - Mayo 23

Continuamos con el tema de programacion javascript.

Para definir un objeto, se crea una variable, y luego se le asigna el valor del objeto, inicializandolo con la palabra reservada new

Ejemplo de Clases y Objetos:

Clase: Carro

Metodos: Acelerar, Detenerse, REversa,

Propiedades: Marca, Modelo, Color.

Creacion de la clase Carro por medio de la funcion constructora

function Autos(marca, modelo, color){

this.marca=marca;

thi.modelo=modelo;

this.color=color;

)

Creacion de una instancia del objeto carro: 

var carrito1 = new Autos("Hyundai", "coupe", "gris");

Manejo de arreglos.

Los arreglos empiezan desde el indice 0

Un arreglo de 6 elementos, tiene indices del 0 al 5.

El lenguaje javascript define el tipo de variable con solo asignarle un valor.

Se explico como se realizara el trabajo de investigación 2.

JSON web services (concepto, construccion, edicion y lectura) es el tema de mi grupo.

Existen palabars reservadas para manejar strings, como slice(extrae una porcion),

string.char(extrae el caracter segun el indice) y string.length(longitud de una cadena).

Semana 9: Mayo 24 - Mayo 30

Continuamos con el tema de Javascript.

Matrizes: estructura que almacena valores en mas de una dimensión.

La estructura se define creando un array dentro de las posiciones de otro array.

Array de objetos: tipo de arreglo especial que puede contener objetos como elementos

sintaxis:

-objetos creado por ejectucion: var miArray = [{edad:30},{casa:53},{autos:2}];

-objetos creatdo previamente: var a = {edad:30};

var b = {casa: 53};

var c = {autos:2};

unArray = [a,b,c];

Realizamos la presentacion de los temas de investigacion de cms.

Mi grupo presento creación de un cms con shopify.

Semana 10: Mayo 31 - Junio 6

Realizamos el parcial 1, sobre e commerce y javascript.

Realizamos una discusión sobre pasados laboratorios y las diferentes soluciones por parte de diferentes estudiantes y del profesor.

Semana 11: Junio 7 - Junio 13

Iniciamos el tema Manipulación de objetos DOM.

Dom es un conjunto de utilizades que perminten manipular documentos XML y HTML.

Dom transforma un archivo de html en un arbol.

El navegador se encarga de generar automaticamente un arbol de nodos a partir de un archivo html.

Tipos de nodo: 

Document: representa la pagina html

Element: representa los elementos entre etiquetas de apertura y cierre

Attr: representa atributos de un elemento

Text: Almacena el contenido de texto entre etiquetas de apertura y cierre

Comment: Representa comentarios en el documento HTML.

Metodos de acceso directo:

getElementById: Devuelve el elemento html con un id específico

getElemetsByName: Devuelve el elemento html con un name específico

getElementsByTagName: Devuelve el elemento html con un tagname específico

getElementsByClassName: Devuelve el elemento html con un nombre de clase específico

Semana 12: Junio 14 - Junio 20

Se realizo una explicacion extensiva sobre el proyecto 2. Trata sobre la creación de una aplicación de una página, en un caso de cálculo de datos y muestra de mensajes para una sala hospitalaria.

Continumaos el tema de manipulación de DOM.

Manipulación de nodos:

El primer elemento es el navegarador, este contiene el objeto document o pagina html:

window > document > html > head y body > meta, title, link div, script> img, h1, p, etc.

Nodo padre: nivel arribal
Nodo hermano: mismo nivel
Nodo hijo: nivel debajo

Funciones básicas de manipuacion de nodos:

createElement(tagname): crea un elemento con el nombre del parametro (tagname)

createTextNode(text) crea un texto que puede ser añadido a un nodo

nodoPadre.appendChilde(node): añade un nuevo nodo, como hijo de otro nodo.

removeChild(child): elimina nodo hijo de acuerdo al parametro child.

Semana 13: Junio 21 - Junio 27

Se asigno un laboratorio #6 para medir los conocimientos mas recientes sobre javscript.

Comenzamos con el tema de Jquery.

Jquery es un lenguaje de programación, similar a Javascript, pero mas abreviado y facil de manejar.

Realizamos las presentaciones en grupo de los Talleres Backend. Mi grupo presento el tema de JSON Web Services: Concepto, Construcción, Edición, Lectura y uso en Back y Front End. Tambien se presento un ejemplo practico de JSON.

Semana 14: Junio 28 - Julio 4

Continumaos con explicaciones de como utilizar Jquery.

Se realizo demostraciones practicas de su utilización.

Manipulacion Dom con Jquery:

.htmo() establece o devuelve el contenido de elementos selecionados.

.text() establece o devuelve el contenido de texto de los elementos.

.remove() elimina los elementos selecionados por completo.

.append() inserta contenido al final de los elementos selecionados.

.val() establece o devuelve el valor de los input field.

.attr() devuelve el valor del atributo de un elemento.

.get() selecciona una coleccion de objetos html.

Ajax.query

El metodo ajax de jquery es utilizado para relizar solicitud Ajax o de una solicitud http asincrona.

Sintaxis: 

$ajax({nombre:valor, nombre:valor});

type:especifica el tipo de solicitud.

url: especifica el url hacia el cual se envia la solicitud ajax.

async: indica si la solicitud debe manejarse de forma asincrona o no.

dataType: tipo de dato esperado como respuesta del servidor: json, text, etc.

success: debe ejecutarse cuando la solicitud sea exitosa.

La variable xhr almacena un objeto de tipo XMLHttpRequest que almacena datos de una conexión a un servidor: readState, status, statusText, responseJSON, responseText, etc...

Notación JSON:

JSON es un formato de intercambios datos, basado en texto, que utiliza la sintaxis de objetos de Javascript.

Puede ser utilizado de forma independiente de Javascript.

Debe ser convertido a un objeto nativo Javascript para poder acceder a sus datos(parsing)

Un objeto JSON se almacena en un archivo *.json.

Semana 15: Julio 5 - Julio 11

Concluimos los materiales de estudio del semestre, con una demostración practica de jquery y json.

Se realizo una pequeña revisión y observaciones del material desarrollado hasta el momento por mi grupo para el proyecto final.