Merge pull request #7571 from alistermada/fix/links-in-video-descript…

…ions Fix links in video challenge descriptions
FreeCodeCamp · ab5b1451e4fc250c238ddad36ff4342cabee2fef · raisedadead committed Mar 17, 2016 · Mar 17, 2016 · ab5b145
2 parents 22744fc + c13e234
commit ab5b1451e4fc250c238ddad36ff4342cabee2fef
@@ -57,9 +57,8 @@ export class Lecture extends React.Component {
     return transcript.map((line, index) => (
       <p
         className='lead text-left'
-        key={ dashedName + index }>
+        key={ dashedName + index }
-        { line }
+        dangerouslySetInnerHTML={{__html: line}} />
-      </p>
     ));
   }
 
@@ -63,9 +63,9 @@
         "If your algorithm slows down exponentially with the input, you're going to want to look for a more efficient way to solve that problem.",
         "Whenever you’re coding loops within loops, you want to be especially mindful of time complexity.",
         "Big O Cheat Sheet is the place to look once you can classify your algorithm, like as a 'merge-sort' or a 'quick-sort'.",
-        "bigocheatsheet.com/",
+        "<a href='http://bigocheatsheet.com/' target='_blank'>bigocheatsheet.com/</a>",
         "Princeton Coursera course is NOT for the faint of heart. With examples and practice in Java, this course will cover iterating over data specifically with Java, sorting, and searching algorithms.",
-        "coursera.org/course/algs4partI"
+        "<a href='http://coursera.org/course/algs4partI' target='_blank'>coursera.org/course/algs4partI</a>"
       ],
       "challengeSeed": [
         "139877627"
@@ -100,9 +100,9 @@
         "Si tu algoritmo se hace más lento de manera exponencial a medida que aumenta la entrada, querrás buscar una forma más eficiente de resolver el problema.",
         "Siempre que programes ciclos dentro de ciclos, querrás ser especialmente cuidadoso de la complejidad temporal.",
         "La hoja de copialina de la notación O mayúscula es el lugar donde mirar para clasificar tu algoritmo, como el de un 'ordenamiento por mezcla' o un 'ordenamiento rápido'.",
-        "bigocheatsheet.com/",
+        "<a href='http://bigocheatsheet.com/' target='_blank'>bigocheatsheet.com/</a>",
         "El curso de Coursera de Princeton no es para débiles de corazón. Con ejemplos y prácticas en Java, este curso cubre iteración sobre los datos especifcamente algoritmos de ordenamiento y búsqueda.",
-        "coursera.org/course/algs4partI"
+        "<a href='http://coursera.org/course/algs4partI' target='_blank'>coursera.org/course/algs4partI</a>"
       ],
       "titleEs": "Notación O mayúscula: Unos pocos ejemplos"
     }
@@ -7,14 +7,14 @@
       "id": "56b15f15632298c12f315184",
       "title": "Chrome Dev Tools: Elements",
       "description": [
-        "This is basic info and a mini-lesson on the Elements tab of Chrome Dev Tools. Check out more in-depth documentation here: developers.google.com/web/tools/iterate/inspect-styles/basics",
+        "This is basic info and a mini-lesson on the Elements tab of Chrome Dev Tools. Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/iterate/inspect-styles/basics' target='_blank'>developers.google.com/web/tools/iterate/inspect-styles/basics</a>",
         "We will be using the webpage mckellen.com/ per suggestion of Free Code Camp user kmiasko.",
         "If you right click and select 'Inspect element', you can have access to the elements tab. You can change text, background color, text color, and any other CSS or HTML you'd like!",
         "These changes don't set up automatically, so don't use this as an IDE or a place to create or edit anything you want to save. You can set up something called 'persistent authoring' to save.",
         "Cascade, inherit, and other CSS rules still apply, so keep that in mind as you play around. Additionally, overridden styles will be shown as having a strike through them.",
         "It should also be noted that all of the code you're seeing in this 'tree' is current HTML, not the original when the page loaded. If you use JavaScript or jQuery to change something, it will be updated on this tree.",
         "Padding, border, and margins are easily inspected and edited using the colorful box on the right or bottom side.",
-        "Please check out the Chrome Dev Tools documentation at developers.google.com/web/tools/chrome-devtools/"
+        "Please check out the Chrome Dev Tools documentation at <a href='http://developers.google.com/web/tools/chrome-devtools/' target='_blank'>http://developers.google.com/web/tools/chrome-devtools/</a>"
       ],
       "challengeSeed": [
         "137186237"
@@ -33,14 +33,14 @@
       "type": "hike",
       "challengeType": 6,
       "descriptionEs": [
-        "Esta es información básica y una mini-lección sobre la pestaña Elements en las herramientas de desarrollo de Chrome. Echa un vistazo a la documentación más detallada aquí: developers.google.com/web/tools/iterate/inspect-styles/basics ",
+        "Esta es información básica y una mini-lección sobre la pestaña Elements en las herramientas de desarrollo de Chrome. Echa un vistazo a la documentación más detallada aquí: <a href='http://developers.google.com/web/tools/iterate/inspect-styles/basics' target='_blank'>developers.google.com/web/tools/iterate/inspect-styles/basics</a>",
         "Vamos a utilizar la página web mckellen.com/ por sugerencia del usuario de FreeCodeCamp kmiasko.",
         "Si pulsas con el botón derecho y seleccionas 'Inspeccionar elemento', tendrás acceso a la pestaña elements. ¡Puedes cambiar el texto, el color de fondo, el color de texto y cualquier otra propiedad CSS o elemento HTML que desees!",
         "Estos cambios no se establecen de forma automática, por lo que no debes usar el inspector como un IDE o como un lugar para crear o editar cualquier cosa que desees guardar. Puedes configurar algo que se llama 'autoría persistente' para salvar.",
         "Las reglas de CSS como cascada, herencia y otras se aplican, así que tenlo en cuenta a medida que juegas. Además, los estilos anulados se muestran con un tachado sobre ellos. ",
         "También hay que señalar que todo el código que veas en ese 'árbol' es código HTML actual, no el original que había cuando se cargó la página. Si utilizas jQuery o JavaScript para cambiar algo, esté árbol se actualizará.",
         "El relleno, los bordes y los márgenes se inspeccionan fácilmente y puedes editarlos usando la caja con colores que encontrarás al lado derecho o en la parte de abajo.",
-        "Por favor, echa un vistazo a la documentación de las herramientas de desarrollo de Chrome en developers.google.com/web/tools/chrome-devtools/"
+        "Por favor, echa un vistazo a la documentación de las herramientas de desarrollo de Chrome en <a href='http://developers.google.com/web/tools/chrome-devtools/' target='_blank'>http://developers.google.com/web/tools/chrome-devtools/</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Elementos"
     },
@@ -54,7 +54,7 @@
         "If you look at the line on the side, you'll notice a pattern of colors. Those colors each represent a different type of content in the request.",
         "The longer the line is a certain color, the longer that type of content took in that request. Ultimately, you want short lines, and if any request has long lines, you know what may be slowing down the web page.",
         "If you click a request in the log, you can get even more detailed information.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/profile-performance/network-performance/resource-loading"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/profile-performance/network-performance/resource-loading' target='_blank'>developers.google.com/web/tools/profile-performance/network-performance/resource-loading</a>"
       ],
       "challengeSeed": [
         "137187539"
@@ -78,7 +78,7 @@
         "Si te fijas en la línea al lado derecho, te darás cuenta de un patrón de colores. Cada color representa un tipo diferente de contenido en la solicitud. ",
         "Cuanto más larga sea la línea de un color determinado, tanto más tiempo tomó ese tipo de contenido en la solicitud. En últimas quieres líneas cortas, y si cualquier solicitud tiene largas líneas, sabes que puede estar ralentizando la página web.",
         "Si pulsas sobre una solicitud en la bitácora, podrás obtener información más detallada.",
-        "Consulta más documentación detallada aquí: developers.google.com/web/tools/profile-performance/network-performance/resource-loading"
+        "Consulta más documentación detallada aquí: <a href='http://developers.google.com/web/tools/profile-performance/network-performance/resource-loading' target='_blank'>developers.google.com/web/tools/profile-performance/network-performance/resource-loading</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: red"
     },
@@ -93,7 +93,7 @@
         "By slowing everything down and giving yourself a chance to examine what's happening at every spot you've set, you can keep track of exactly what's happening in the page or app.",
         "Once all of the breakpoints are set, you can step through the code and examine the state of your page or app at every breakpoint.",
         "Just like with elements, you can live-edit through Dev Tools, but remember to save those changes however you can so your progress isn't lost.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/javascript/breakpoints/"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/javascript/breakpoints/' target='_blank'>developers.google.com/web/tools/javascript/breakpoints/</a>"
       ],
       "challengeSeed": [
         "137188025"
@@ -119,7 +119,7 @@
         "Al reducir la velocidad de todo y darte la oportunidad de examinar lo que está sucediendo en cada punto que hayas configurado, podrás controlar exactamente lo que está sucediendo en la página o aplicación.",
         "Una vez has establecido todos los puntos de interrupción, puedes recorrer el código y examinar el estado de tu página o aplicación en cada punto de interrupción.",
         "Al igual que con los elementos, puedes editar en vivo mediante las herramientas de desarrollo, pero recuerda que debes guardar esos cambios para que no pierdas tu progreso.",
-        "Revisa documentación más detallada aquí: developers.google.com/web/tools/javascript/breakpoints/"
+        "Revisa documentación más detallada aquí: <a href='http://developers.google.com/web/tools/javascript/breakpoints/' target='_blank'>developers.google.com/web/tools/javascript/breakpoints/</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Fuentes"
     },
@@ -134,7 +134,7 @@
         "All of this will help you to better understand what's happening in the browser, particularly which events require more browser memory than others.",
         "When you're using timeline, remember to use this 'clear' button and to start recording before you load the page, depending on what you want to capture.",
         "You'll notice that when you record JS events, clicking on the title or 'function call' on the left will take you to the document and line of that function using the resource panel.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool' target='_blank'>developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool</a>"
       ],
       "challengeSeed": [
         "137188786"
@@ -160,7 +160,7 @@
         "Todo esto te ayudará a entender mejor lo que está pasando en el navegador, en particular cuáles eventos requieren más memoria del navegador.",
         "Cuando uses la línea de tiempo, recuerda que debes utilizar el botón 'limpiar' (clear) para iniciar la grabación y antes de cargar la página, dependiendo de lo que desees capturar.",
         "Te darás cuenta de que cuando grabas eventos JS, al pulsar en el título o en una 'llamada a una función' al lado izquierdo, te llevará al documento y a la línea de esa función en el panel de recursos. ",
-        "Revisa documentación más detallada aquí: developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool"
+        "Revisa documentación más detallada aquí: <a href='http://developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool' target='_blank'>developers.google.com/web/tools/profile-performance/evaluate-performance/timeline-tool</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Línea de tiempo"
     },
@@ -172,7 +172,7 @@
         "There are three types of profiles you can collect: CPU profile, HEAP snapshot, and HEAP profile. HEAP profiles have more to do with memory usage, while a CPU profile has more to do with JavaScript performance.",
         "A profiler called V8 is used while your code runs to pinpoint what in the JavaScript takes the most time, making it easy to optimize your code.",
         "Each of these profiles can be viewed on the left, and you can take multiple profiles of each. Overall, the profiles tab is helpful when optimizing code.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/profile-performance/rendering-tools/js-execution"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/profile-performance/rendering-tools/js-execution' target='_blank'>developers.google.com/web/tools/profile-performance/rendering-tools/js-execution</a>"
       ],
       "challengeSeed": [
         "137189330"
@@ -195,7 +195,7 @@
         "Hay tres tipos de perfiles que se pueden recolectar: el perfil de la CPU, instantáneas de la memoria con estructura montón (Heap), y el perfil de la memoria con estructura montón. Los perfiles de memoria en estructura montón tienen más que ver con el uso de memoria, mientras que un perfil de la CPU tiene más que ver con el rendimiento de JavaScript. ",
         "Un perfilador llamado V8 se usa mientras se ejecuta el código para identificar lo que en el JavaScript toma mucho tiempo, facilitándote de esta forma optimizar tu código.",
         "Cada uno de estos perfiles se puede ver a la izquierda, y se puede tomar múltiples perfiles de cada uno. En general, la pestaña de perfiles es muy útil cuando deseas optimizar tu código. ",
-        "Revisa documentación más detallada aquí: developers.google.com/web/tools/profile-performance/rendering-tools/js-execution"
+        "Revisa documentación más detallada aquí: <a href='http://developers.google.com/web/tools/profile-performance/rendering-tools/js-execution' target='_blank'>developers.google.com/web/tools/profile-performance/rendering-tools/js-execution</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Perfiles"
     },
@@ -206,7 +206,7 @@
         "The Resources panel lets you inspect resources that are loaded in the inspected page including IndexedDB or Web SQL databases, local and session storage, cookies, Application Cache, images, fonts, and style sheets.",
         "You can view and edit all of this information within the browser.",
         "As you get into more advanced web building, play around with the resources panel and see how it can help you understand the requirements of your app and page in real time.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/iterate/manage-data/index"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/iterate/manage-data/index' target='_blank'>developers.google.com/web/tools/iterate/manage-data/index</a>"
       ],
       "challengeSeed": [
         "137193676"
@@ -223,7 +223,7 @@
         "El panel de Recursos te permite inspeccionar los recursos que se cargan en la página, incluyendo IndexedDB o bases de datos SQL Web, almacenamiento local y de sesión, las galletas (cookies), memoria caché de aplicaciones, imágenes, fuentes y hojas de estilo.",
         "Puedes ver y editar toda esta información dentro del navegador.",
         "A medida que vayas construyendo aplicaciones web más avanzadas, juega con el panel de recursos y verás cómo te ayudará a entender los requisitos de tu aplicación y de tu página en tiempo real.",
-        "Revisa documentación más detallada aquí: developers.google.com/web/tools/iterate/manage-data/index"
+        "Revisa documentación más detallada aquí: <a href='http://developers.google.com/web/tools/iterate/manage-data/index' target='_blank'>developers.google.com/web/tools/iterate/manage-data/index</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Recursos"
     },
@@ -274,7 +274,7 @@
         "You should know that messages stack up, and you can clear them by typing and entering 'clear()'. You can also save the log by selecting 'Preserve Log'.",
         "There are different commands that will log differently, like console.log() for basic logging, console.error() & console.warn() for 'eye catching stuff'.",
         "The console can track exceptions, which basically means when something goes wrong. It can even pause the code during those exceptions, a function that you might remember from the 'Source' tab.",
-        "Check out more in-depth documentation here: developers.google.com/web/tools/javascript/console/"
+        "Check out more in-depth documentation here: <a href='http://developers.google.com/web/tools/javascript/console/' target='_blank'>developers.google.com/web/tools/javascript/console/</a>"
       ],
       "challengeSeed": [
         "137194773"
@@ -299,7 +299,7 @@
         "Debes saber que los mensajes se apilan y que puedes limpiarlos escribiendo <code>clear()</code>. También puedes guardar la bitácora seleccionando 'Preserve Log'. ",
         "Hay diferentes órdenes que registrarán en bitácoras de manera diferente, como console.log() para registrar información básica, console.error() y console.warn() para registrar en bitácoras 'información llamativa'.",
         "La consola puede realizar un seguimiento de excepciones, que básicamente registra cuando algo sale mal. Puede incluso hacer una pausa en el código durante esas excepciones, función que posiblemente recuerdes de la pestaña 'Fuente'. ",
-        "Revisa documentación más detallada aquí: developers.google.com/web/tools/javascript/console/"
+        "Revisa documentación más detallada aquí: <a href='http://developers.google.com/web/tools/javascript/console/' target='_blank'>developers.google.com/web/tools/javascript/console/</a>"
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Consola"
     },
@@ -308,7 +308,7 @@
       "title": "Chrome Dev Tools: Summary",
       "description": [
         "1.) Chrome Dev Tools are awesome, and the more you can dive in and try to use them, the faster your skill level will grow.",
-        "2.) Use the documentation, even if you've never read documentation before: developers.google.com/web/tools/chrome-devtools/",
+        "2.) Use the documentation, even if you've never read documentation before: <a href='http://developers.google.com/web/tools/chrome-devtools/' target='_blank'>developers.google.com/web/tools/chrome-devtools/</a>",
         "3.) Once you start to get comfortable in one tab, stretch yourself. Working effectively with all of the tabs will serve you exponentially more than sticking in your comfort zone."
       ],
       "challengeSeed": [
@@ -324,7 +324,7 @@
       "challengeType": 6,
       "descriptionEs": [
         ", Las herramientas de desarrollo de Chrome son impresionantes, y cuanto más te puedas sumergir y tratar de utilizarlas, más rápido aumentará tu nivel. ",
-        ", Utiliza la documentación, incluso si nunca has leído documentación antes: developers.google.com/web/tools/chrome-devtools/ ",
+        ", Utiliza la documentación, incluso si nunca has leído documentación antes: <a href='http://developers.google.com/web/tools/chrome-devtools/' target='_blank'>developers.google.com/web/tools/chrome-devtools/</a> ",
         ", Una vez que comiences a sentirte cómodo en una pestaña, rétate aprendiendo a usar una diferente. Trabajar eficazmente con todas las pestañas te servirá exponencialmente más que pegarte en tu zona de confort."
       ],
       "titleEs": "Herramientas de desarrollo de Chrome: Resumen"
@@ -615,7 +615,7 @@
       "title": "Computer Basics: How the Internet Works",
       "description": [
         "This is a brief and basic overview of how the internet works.",
-        "For a more in-depth explanation, check out web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm",
+        "For a more in-depth explanation, check out <a href='http://web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm' target='_blank'>web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm</a>.",
         "Let's talk a little more about how the internet works.",
         "We've already established that every device and router on the internet has its own IP address, which is assigned based on location.",
         "Using these IP addresses, your device can talk to your modem, then to a router, which is set up by a web service.",
@@ -626,7 +626,7 @@
         "It's really amazing.",
         "What I want you take away from this video is that your device, since it has an IP address, can send out a request for information, and that information will get back to your device via servers and routers that comprise the internet.",
         "Now, this explanation is really quite basic.",
-        "For more information, check out web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm."
+        "For more information, check out <a href='http://web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm' target='_blank'>web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm</a>."
       ],
       "challengeSeed": [
         "132548579"
@@ -646,7 +646,7 @@
       "challengeType": 6,
       "descriptionEs": [
         "Esta es una descripción breve y descripción de cómo funciona Internet.",
-        "Para una explicación más en profundidad, dale un vistazo a web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm",
+        "Para una explicación más en profundidad, dale un vistazo a <a href='http://web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm' target='_blank'>web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm</a>.",
         "Vamos a hablar un poco más acerca de cómo funciona el Internet.",
         "Ya hemos establecido que todos los dispositivos y enrutadores en Internet tienen su propia dirección IP, que se asigna en función de la ubicación.",
         "Usando estas direcciones IP, tu dispositivo puede hablar con tu módem, y después con un enrutador, el cual debió ser configurado por ejemplo con un servicio web con el que te intentas conectar.",
@@ -657,7 +657,7 @@
         "Es realmente increíble.",
         "Lo que quiero que te lleves de este video es que tu dispositivo, que tiene una dirección IP, puede enviar una petición de información, y que esa información regresará a tu dispositivo por medio de servidores y enrutadores que componen el Internet.",
         "Ahora bien, esta explicación es realmente básica.",
-        "Para obtener más información, echa un vistazo a web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm."
+        "Para obtener más información, echa un vistazo a <a href='http://web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm' target='_blank'>web.stanford.edu/class/msande91si/www-spr04/readings/week1/InternetWhitepaper.htm</a>."
       ],
       "titleEs": "Fundamentos básicos del computador: ¿Cómo funciona Internet"
     },
@@ -706,7 +706,7 @@
         "CDNs accomplish this by providing effective routes between their own servers that can fast-track users to their destination, or if its faster and/or cheaper, another copy of that website destination that is being hosted on another server.",
         "This concept and type of service is not new, but is becoming more popular as the internet grows.",
         "Websites contract and pay a CDN service, who in turn pays an internet provider to use their servers for their data.",
-        "An example of CDNs are Google's Hosted Libraries. -- developers.google.com/speed/libraries/#jquery",
+        "An example of CDNs are Google's Hosted Libraries. -- <a href='http://developers.google.com/speed/libraries/#jquery' target='_blank'>developers.google.com/speed/libraries/#jquery</a>",
         "Google hosts these libraries so that your users can load them into your own site much more quickly than if you host them yourself.",
         "There's a chance the user's browser is even storing a cached version from visiting a previous page, making the process even quicker. If you aren't familiar with the term 'cache', don't worry, we'll cover that in future videos.",
         "As a user, you probably use CDNs all the time without realizing it.",
@@ -735,7 +735,7 @@
         "Las RDC logran esto proporcionando rutas eficaces entre sus propios servidores que pueden encaminar rápidamente a los usuarios a sus destinos, o si resulta más rápido o económico, a otra copia del sitio web destino, la cual se aloja en otro servidor.",
         "Este concepto y tipo de servicio no es nuevo, pero es cada vez más popular a medida que crece Internet.",
         "Los sitios web contratan y pagan un servicio a las RDC, quienes a su vez le pagan a proveedores de Internet para utilizar sus servidores y almacenar en estos sus datos.",
-        "Un ejemplo de CDN son las Bibliotecas alojadas de Google - developers.google.com/speed/libraries/#jquery",
+        "Un ejemplo de CDN son las Bibliotecas alojadas de Google - <a href='http://developers.google.com/speed/libraries/#jquery' target='_blank'>developers.google.com/speed/libraries/#jquery</a>",
         "Google organiza estas bibliotecas para que tus usuarios puedan cargarlas en tus propios sitio web mucho más rápido que si las alojaras tu mismo.",
         "Hay incluso una posibilidad de que el navegador del usuario le presente  una copia en `caché' (almacenamiento local temporal) realizada durante una visita previa, haciendo que el proceso sea aún más rápido. Si no estás familiarizado con el término 'caché', no te preocupes, vamos a cubrirlo en videos futuros. ",
         "Como usuario, es probable que utilices RDC  todo el tiempo sin darte cuenta.",
@@ -48,7 +48,7 @@
         "If you've ever seen a webpage that loads the text first, then after a bit loads the formatting and style, you've seen a page that didn't have the links to style and script in the correct places.",
         "This all has to do with how the browser decides it's loaded enough information to display. There's an event called 'DOMContentLoaded', and once that event happens, whatever is loaded will be displayed.",
         "The DOM will tell the browser it's ready once the HTML is loaded, and sometimes the CSS and JS hasn't caught up. However, if you place the CSS in the header and the JS in the footer, you can ensure that all content will be loaded before the DOM triggers the 'DOMContentLoaded' event, the event that shows the user your content.",
-        "This is a simple explanation, as most of these videos are. For more information, I really liked this resource: ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload/"
+        "This is a simple explanation, as most of these videos are. For more information, I really liked this resource: <a href='http://ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload' target='_blank'>ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload</a>"
       ],
       "challengeSeed": [
         "139879984"
@@ -71,7 +71,7 @@
         "Si alguna vez has visto una página web que carga el texto primero, y después de un momento carga el formato y el estilo, entonces era una página que no tenía los enlaces hacia el estilo y el código en los lugares correctos.",
         "Esto tiene que ver con la forma en que el navegador decide si ha cargado suficiente información para mostrar. Hay un evento llamado 'DOMContentLoaded', y una vez que ese evento ocurre, lo que sea que se haya cargado hasta entonces será mostrado.",
         "El DOM le dirá al navegador que está listo una vez que el código HTML ha sido cargado, y a veces el CSS y JS no se han alcanzado a cargar. Si pones el CSS en el encabezado y el JS al pie de página, puedes estar seguro que todo el contenido será cargado antes que el DOM desencadene el evento 'DOMContentLoaded', el cual muestra tu contenido al usuario.",
-        "Esta es una explicación simplificada, al igual que la que encontrarás en el resto de estos videos. Si quieres más información, creo que el siguiente enlace es de bastante ayuda: ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload/"
+        "Esta es una explicación simplificada, al igual que la que encontrarás en el resto de estos videos. Si quieres más información, creo que el siguiente enlace es de bastante ayuda: <a href='http://ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload' target='_blank'>ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload</a>"
       ],
       "titleEs": "El DOM: Estilo en el encabezado, código al pie de página"
     }
@@ -8,7 +8,7 @@
       "title": "JavaScript Lingo: MDN and Documentation",
       "description": [
         "This is a basic intro to MDN and the concept of documentation.",
-        "MDN, Mozilla Developer Network, is a fantastic open source collaboration that documents not only JavaScript, but many other languages and topics. If you haven't heard of them, you should check them out now. I get lots of information from developer.mozilla.org/en-US/docs/Web/JavaScript",
+        "MDN, Mozilla Developer Network, is a fantastic open source collaboration that documents not only JavaScript, but many other languages and topics. If you haven't heard of them, you should check them out now. I get lots of information from <a href='http://developer.mozilla.org/en-US/docs/Web/JavaScript' target='_blank'>developer.mozilla.org/en-US/docs/Web/JavaScript</a>",
         "When I say documentation, I am talking about information that is provided about the product to its users. The documentation at MDN isn't necessarily written by the people behind JS. Brendan Eich created JS in 1995, but it's now a community driven project that continues to grow.",
         "As you continue to learn JavaScript, jQuery, and pretty much any languages or services for development or programming, documentation is your friend. ",
         "The faster you get comfortable reading and referencing documentation, the faster you will grow as a developer.",
@@ -32,7 +32,7 @@
       "challengeType": 6,
       "descriptionEs": [
         "Esta es una introducción básica a MDN y el concepto de la documentación.",
-        "MDN, Mozilla Developer Network, es una fantástica colaboración de fuentes abiertas que documenta no sólo JavaScript, sino muchos otros lenguajes y temas. Si no has oído hablar de ellos, deberías darles un vistazo ahora. Personalmente obtengo mucha información de developer.mozilla.org/en-US/docs/Web/JavaScript ",
+        "MDN, Mozilla Developer Network, es una fantástica colaboración de fuentes abiertas que documenta no sólo JavaScript, sino muchos otros lenguajes y temas. Si no has oído hablar de ellos, deberías darles un vistazo ahora. Personalmente obtengo mucha información de <a href='http://developer.mozilla.org/es/docs/Web/JavaScript' target='_blank'>developer.mozilla.org/es/docs/Web/JavaScript</a>",
         "Cuando digo documentación, estoy hablando acerca de la información que se proporciona sobre el producto a sus usuarios. La documentación de MDN no necesariamente está escrita por la gente detrás de JS. Brendan Eich creó JS en 1995, pero hoy en día el proyecto continúa creciendo gracias a un esfuerzo comunitario. ",
         "A medida que continúes aprendiendo JavaScript, jQuery, y prácticamente cualquier otro lenguaje o servicio para desarrollo o programación, la documentación será tu amiga.",
         "Cuanto más rápido te sientas cómodo leyendo y referenciando documentación, más rápido crecerás como desarrollador.",
@@ -186,7 +186,7 @@
       "description": [
         "Methods and functions are ways you can manipulate variables or other sets of information.",
         "Methods are built in to JavaScript, and you will become more familiar with these as you write functions for the bonfires.",
-        "I'd suggest looking through the MDN (Mozilla Developer Network that we discussed in the first video) to familiarize yourself with the sheer amount and general potential for the methods that exist. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index",
+        "I'd suggest looking through the MDN (Mozilla Developer Network that we discussed in the first video) to familiarize yourself with the sheer amount and general potential for the methods that exist. <a href='http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index' target='_blank'>developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index</a>",
         "Examples include '.split(' ')', which will turn a string into an array and can do so in many different ways. Methods are powerful - many times when you want your script to do something, there's a method for that.",
         "Functions, like variables, are something you define and create.",
         "During your algorithm practice at Free Code Camp, you will create functions that take a certain piece of information and manipulate it in whatever way you choose.",
@@ -211,7 +211,7 @@
       "descriptionEs": [
         "Métodos y funciones son formas con las que puedes modificar variables u otros conjuntos de información.",
         "Los métodos están integrados en JavaScript, y te familiarizarás con estos cuando realices los desafíos sobre algoritmos.",
-        "Me gustaría sugerirte dar un vistazo a MDN (Mozilla Developer Network que discutimos en el primer video) para que te familiarices con la cantidad y el potencial general de los métodos que existen. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index",
+        "Me gustaría sugerirte dar un vistazo a MDN (Mozilla Developer Network que discutimos en el primer video) para que te familiarices con la cantidad y el potencial general de los métodos que existen. <a href='http://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Methods_Index' target='_blank'>developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Methods_Index</a>",
         "Los ejemplos incluyen <code>.split (' ')</code>, que convertirá una cadena en un vector y puede hacerlo de muchas maneras diferentes. Los métodos son de gran alcance - muchas veces cuando quieres que tu programa haga algo, ya habrá un método para eso.",
         "Las funciones, al igual que las variables, son algo que tu defines y creas.",
         "Durante tu práctica con algoritmos en FreeCodeCamp, vas a crear funciones que reciben una determinada pieza de información y la manipulan de la forma que elijas.",