eperedo

// Open the developer tools in chrome/edge and run this code in any course page
// If the course only has 10 or less tutorials you are NOT going to see any change.
// Courses with more than 10 tutorials to test this script: https://platzi.com/clases/git-github/
// You will see the pagination at the bottom of the tutorials section
const tutorials = window.initialData?.initialState?.tutorials;
const courseId = window.initialData?.initialState?.course?.id;
const userId = window.contactInfo?.userId;

const avatarDom = document.querySelector('.Actionsv2-avatar');
let avatarUrl = '';

eperedo

function styleDarkMode() {
	var filterStyle = document.createElement('style');
	filterStyle.innerHTML =
		':root{filter: invert(100%);}img, video { filter: invert(100%);}.vjs-fullscreen {background-color: white !important;filter: invert(1) !important;}';
	document.head.appendChild(filterStyle);
}

// run styleDarkMode() in a page that has the dark mode (using the developer tools).
// you can see a preview of how it looks here https://user-images.githubusercontent.com/461124/113607722-2ab34680-960f-11eb-80ff-70599a7081bc.png
// awful, right? But no more eye strain (at least for me)

eperedo

{
  "address_components": [
    {
      "long_name": "Avenida Arequipa",
      "short_name": "Av. Arequipa",
      "types": [
        "route"
      ]
    },
    {

eperedo

Ejercicios

1. Consumir servicio y listar los usuarios en una tabla

// https://jsonplaceholder.typicode.com/users

2. Agregar un textbox que permita realizar una busqueda de los usuarios.

Debe consumir el siguiente servicio // https://jsonplaceholder.typicode.com/users?username={valor-del-input} Solo se debe consumir el servicio cuando se escribe 3 caracteres o mas

eperedo

http://jsbin.com/kiriqufaki/edit?html,css,js,output

eperedo

<template>
	<div>
		About Page {{message}}
	</div>
</template>

<script>

function metaInfo() {
	return {

eperedo

<template>
	<div>
		About Page {{message}}
	</div>
</template>

<script>

function metaInfo() {
	return {

eperedo

function objectToQuery(obj, notInclude = []){
  const keys = Object.keys(obj);
  const keysToConvert = keys.filter((kf) => {
    return notInclude.indexOf(kf) === -1;
  })
  const qs = keysToConvert.map((key) => {
    const currentKey = obj[key];
    return `&${key}=${currentKey}`;
  });
  return qs.join('');

eperedo

var a = [{"id": 42, "name": "TALLA", "companyId": 40, "createdAt": "2017-02-13T21:51:15.000Z", "updatedAt": "2017-02-13T21:51:15.000Z", "flagActive": 1}, {"id": 37, "name": "TELA", "companyId": 40, "createdAt": "2017-02-13T21:23:11.000Z", "updatedAt": "2017-02-13T21:23:11.000Z", "flagActive": 1}, {"id": 38, "name": "TIPO DE PRENDA", "filterable": true}, {"id": 39, "name": "MODELO", "filterable": true}, {"id": 41, "name": "COLOR", "filterable": true}, {"id": 40, "name": "MANGA", "filterable": true}]

function transformArrayToObject(array) {
  var b = {};
  array.forEach((item, index) => {
   var keys = Object.keys(item);
   b[item.id] = {};
   keys.forEach((key) => {
    b[item.id][key] = item[key];
   });

eperedo

1. Abrir el jsbin http://jsbin.com/gorogayusu/1/edit?html,js,console
2. Clonarlo usando el menu File - clone
3. Leer las instrucciones y resolver el ejercicio
4. Al terminar copiar la url del jsbin clonado y agregar en los comentarios de este gist.