¿Qué es JSON?

JSON son las iniciales de JavaScript Object Notation el cual es un formato que guarda objetos de javascript muy ligeros y fáciles de interpretar, lo cual hace que sea mas aceptado que xml y soportado por otros lenguajes de programación como python, C/C++, entre otras.Podemos encontrar archivos json en API’s como la de youtube o la de instagram las cuales son mucho más fáciles de leer que un archivo de xml y más cuando de javascript se trata.El formato de un JSON como respuesta a una petición en github es el siguiente:var archivo = '{ 'login': 'mejorandolaclase', 'id': 2975064, 'url': 'https://api.github.com/orgs/mejorandolaclase', 'avatar_url': 'https://secure.gravatar.com/avatar/df5413a54bf57ab18012f11af00ca4e5?d=https://a248.e.akamai.net/asse...', 'name': '#MejorandoCurso', 'company': null, 'blog': 'https://cursos.mejorando.la', 'location': 'https://cursos.mejorando.la', 'email': 'cursos@mejorando.la', 'html_url': 'https://github.com/mejorandolaclase', 'type': 'Organization' }';data = JSON.parse(archivo);JSON.parse es el encargado de convertir una cadena a un JSON.en donde para acceder a cada elemento debemos hacerlo de la siguiente forma:Sabemos que este JSON lo tenemos en la variable data.> data.name“#MejorandoCurso”Y si quisiéramos editarlo podríamos hacerlo de la siguiente forma: > data.name = 'Mejorando La Clase''Mejorando La Clase'Es tan fácil como hacer una petición a un archivo json y tratarlo como de un objeto tratara, recordemos, JSON guarda objetos de JavaScript!Nota: Los archivos JSON no se deben comentar.¡Sigue atento a las clases para seguir progresando en el camino!

¿Qué es JSON?

Bienvenidos

Materiales

Descarga el código del proyecto

Introducción a HTML5 y CSS3

Preguntas antes de la clase

Diferencias entre Backend y Front-end

¿Qué es un Frontend?

¿Qué es HTML y CSS?

Semántica en HTML5

Metodología BEM

Introducción a CSS I

Introducción a CSS II

Developer Tools en navegador I

Developer Tools en navegador II

Preguntas Y Respuestas

Selectores CSS y flexbox

Preguntas antes de la clase

Flexbox

Imports en CSS

Retícula

Selectores en CSS y Pseudo selectores

Páginas internas

Preguntas y respuestas en clase

Listas Ordenadas, Float y Display

Preguntas antes de la clase

Listas ordenadas

Float y display

Preguntas y respuestas en clase

SASS y workflow profesional

Status HTTP

Counter Increment y pseudoSelectores

Textos y estilos con CSS3 Parte I

Textos y estilos con CSS3 Parte II

Animaciones con CSS

SASS

Preguntas y respuestas en clase

Contenido complementario

¿Por qué tu sitio web es tan lento?: Carga de navegadores

Preprocesadores CSS

Dibujando con CSS

Cómo acceder a la cámara de un dispositivo con la API de HTML5

Cómo crear filtros en CSS

Reticulas en CSS

Proyecto: Creando un App de Clima

HTML, CSS básico y uso de selectores

Estructura y etiquetas en HTML

Introducción a CSS

Selectores en CSS

Atributos del Selector

Selectores de Atributo

Sesión de preguntas y respuestas

Metodología BEM en HTML5 y CSS3

Float vs Display

Unidades de medida

Metodología BEM

Pseudo selectores

Sesión de preguntas y respuestas

CSS y workflow profesional

Progressive Enhancement

Fuentes y tipografías web

Responsive Media Queries

Imagenes Responsive y Retina

Preprocesadores CSS y SASS

Herramientas

Conceptos Básicos de JS y JQuery

Bases de desarrollo web moderno

Definición de JSON y API Rest

¿Qué es JSON?

DOM, BOM, JSON, AJAX

DOM: Document Object Model

Etiqueta Template en HTML5

Geolocation

Closures, Jquery y Local Storage en nuestra aplicación

Closures

Introduccion a GIT

Conectando con API Externa

Inyectando Datos en nuestro template

Añadiendo más ciudades a nuestra app

Guardando datos en LocalStorage