<commit_before><!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">

  <title>Writing Maintainable JavaScript</title>

  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">

  <link rel="stylesheet" href="css/reveal.css">
  <link rel="stylesheet" href="css/theme/white.css" id="theme">
  <link rel="stylesheet" href="css/custom.css">

  <!-- Code syntax highlighting -->
  <link rel="stylesheet" href="lib/css/zenburn.css">

  <!-- Printing and PDF exports -->
  <script>
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = window.location.search.match(/print-pdf/gi) ?
      'css/print/pdf.css' : 'css/print/paper.css';
    document.getElementsByTagName('head')[0].appendChild(link);
  </script>

  <!--[if lt IE 9]>
		<script src="lib/js/html5shiv.js"></script>
		<![endif]-->
</head>

<body>

  <div class="reveal">

    <!-- Any section element inside of this container is displayed as a slide -->
    <div class="slides">
      <section>
        <img class='sponsors' src='img/sponsors.png'></img>
      </section>

      <section>
        <h3 class='isolated'>Writing Maintainable JavaScript</h3>
        <p>
          <small>by <a href="mailto:<EMAIL>"><NAME></a></small>
        </p>
        <p class='footer'>
          <img class='logo' src='./img/codecamp-logo.png' />
        </p>
        <aside class="notes">
          <ul>
            <li>Solutions PMG</li>
            <li>Mintel</li>
            <li>Responsibility to future programmers</li>
            <li>Comfort can work against us in the long run</li>
            <li>Well written prose</li>
            <li>Design Patterns book</li>
          </ul>
        </aside>
      </section>

      <section>
        <img class='prominent-book-cover' src="img/book-covers/javascript-definitive-guide.jpg" />
        <p class='reference'>
          <a target="_blank"
            href='http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/0596000480'>[1]</a>
        </p>
      </section>

      <section>
        <h3>Modules</h3>
        <ul>
          <li>Modules help us organize our code</li>
          <li>Modules help us avoid polluting the global namespace</li>
        </ul>
        <pre class='tree'>
.
├── css
│   └── style.css
├── index.html
└── js
    ├── app.js
    ├── collections
    │   └── cart.js
    ├── lib
    │   ├── backbone.js
    │   ├── jquery.js
    │   ├── require.js
    │   └── underscore.js
    ├── models
    │   └── item.js
    └── views
        ├── cartcollectionview.js
        ├── itemcollectionview.js
        └── itemview.js
					</pre>
        <p class='reference'>
          <a target="_blank"
            href='https://github.com/javascript-playground/backbone-require-example'>[2]</a>
        </p>
      </section>

      <section>
        <h3>RequireJS</h3>
        <pre><code>
define(["lib/backbone"], function(Backbone) {
  function ItemView() {
    // ...
  });
  return ItemView;
});
          </code></pre>
        <p class='reference'>
          <a target="_blank" href='http://requirejs.org/'>[3]</a>
        </p>
        <aside class="notes">
          <ul>
            <li>Helps with organizing our code into small modules with specific intent</li>
            <li>Helps us avoid polluting the global namespace</li>
          </ul>
        </aside>
      </section>

      <section>
        <pre><code>
define(["lib/backbone", "views/ItemView"]
    function(Backbone, ItemView) {
  function ItemCollectionView () {
    // ...
  });
  return ItemCollectionView;
});
          </code></pre>
      </section>

      <section class='design-patterns-book'>
        <img class='prominent-book-cover' src="img/book-covers/design-patterns.jpg" />
        <p class='reference'>
          <a target="_blank"
             href='http://www.amazon.com/Design-Patterns-Elements-Reusable-Object-Oriented-ebook/dp/B000SEIBB8'>[4]</a>
        </p>
      </section>

      <section class='design-patterns-book'>
        <h3>Design Patterns</h3>
        <div>
          <div>
            <img class='book-cover' src="img/book-covers/design-patterns.jpg" />
          </div>
          <div class='content'>
            <ul>
              <li>One of the most influential books in the field of software engineering.</li>
              <li>Presents 23 essential software design patterns that came out of recurring
                solutions to common problems.</li>
              <li>Changes the way you approach writing software.</li>
            </ul>
          </div>
        </div>
      </section>

      <section>
        <h3>3 Types of Patterns</h3>
        <ol>
          <li><strong>Creational</strong>: help you build objects</li>
          <li><strong>Structural</strong>: help you compose objects</li>
          <li><strong>Behavioral</strong>: help you organize functionality</li>
        </ol>
      </section>

      <section>
        <h3>Sample App: Contacts</h3>
        <ul>
          <li>Add - Mediator Pattern</li>
          <li>Search - Abstract Factory Pattern</li>
          <li>Export - Adapter Pattern</li>
        </ul>
      </section>

      <section>
        <div class='code-link'>
          <div class='link'>
            <a target="_blank" href='https://github.com/paulistoan/writing-maintainable-javascript'>
              https://github.com/paulistoan/writing-maintainable-javascript
            </a>
          </div>
          <div class='link'>
            <a target="_blank" href='http://git.io/v8soT'>
              http://git.io/v8soT
            </a>
          </div>
          <img class='qr' src='img/qr-github-code.jpg'></img>
        </div>
      </section>

      <section>
        <h3>Common Themes</h3>
        <ul>
          <li>Program to interfaces, not to implementations.</li>
          <li>Favor composition over inheritance.</li>
        </ul>
      </section>


      <section>
        <h3>Abstract Factory</h3> &ldquo;Provide an interface for creating families of related or dependent
        objects without specifying their concrete classes.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/abstract-factory.png" />
        <p class='reference'>
          <a target="_blank"
             href='https://www.l2f.inesc-id.pt/~david/wiki/pt/images/thumb/a/a6/Abstract-factory-dpcd.png/1400px-Abstract-factory-dpcd.png'>[5]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/abstract-factory.png' />
        <div><a target="_blank" href="../src/abstract-factory-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/abstract-factory.png" />
      </section>

      <section>
        <h3 class='code'>config.js</h3>
        <pre><code>{
  searchFields: [{
      type: 'range',
      name: 'Age'
  }, {
      type: 'phoneNumber',
      name: 'Phone Number'
  }, {
      type: 'text',
      name: '<NAME>'
  }, {
      type: 'text',
      name: '<NAME>'
  }]
}</code></pre>
      </section>

      <section>
        <h3>Creational Design Patterns</h3>
        <ul>
          <li>Abstract Factory</li>
          <li>Builder</li>
          <li>Factory Method</li>
          <li>Prototype</li>
          <li>Singleton</li>
        </ul>
      </section>

      <section>
        <h3>Adapter</h3> &ldquo;Convert the interface of a class into another interface clients expect.
        Adapter lets classes work together that couldn't otherwise because of incompatible
        interfaces.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/adapter.png" />
        <p class='reference'>
          <a target="_blank"
             href='http://buraktas.com/public/images/2015/01/adapter-design-pattern.png'>[6]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/adapter.png' />
        <div><a target="_blank" href="../src/adapter-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/adapter.png" />
      </section>

      <section>
        <h3>Structural Design Patterns</h3>
        <div class='split'>
          <ul>
            <li>Adapter</li>
            <li>Bridge</li>
            <li>Composite</li>
          </ul>
        </div>
        <div class='split'>
          <ul>
            <li>Decorator</li>
            <li>Facade</li>
            <li>Flyweight</li>
            <li>Proxy</li>
          </ul>
        </div>
      </section>

      <section>
        <h3>Mediator</h3> &ldquo;Define an object that encapsulates how a set of objects interact.
        Mediator promotes loose coupling by keeping objects from referring to each
        other explicitly, and it lets you vary their interaction independently.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/mediator.jpg" />
        <p class='reference'>
          <a target="_blank"
             href='http://img.my.csdn.net/uploads/201409/07/1410057502_7783.jpg'>[7]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/mediator.png' />
        <div><a target="_blank" href="../src/mediator-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/mediator-aggregate.png" />
      </section>

      <section>
        <img src="./img/design-patterns-applied/mediator-field.png" />
      </section>

      <section>
        <img src='./img/screenshots/mediator.png' />
      </section>

      <section>
        <h3>Behavioral Design Patterns</h3>
        <div class='split'>
          <ul>
            <li>Chain of responsibility</li>
            <li>Command</li>
            <li>Interpreter</li>
            <li>Iterator</li>
            <li>Mediator</li>
            <li>Memento</li>
          </ul>
        </div>
        <div class='split'>
          <ul>
            <li>Observer</li>
            <li>State</li>
            <li>Strategy</li>
            <li>Template method</li>
            <li>Visitor</li>
          </ul>
        </div>
      </section>

      <section>
        <h3>Essential Takeaways</h3>
        <ul>
          <li>Program to interfaces, not to implementations.</li>
          <li>Favor composition over inheritance.</li>
        </ul>
        <aside class="notes">
          <ul>
            <li>
              <strong>Program to interfaces</strong>
              <ul>
                <li>Easy to swap out implementations, configurable</li>
                <li>Maintainable</li>
              </ul>
            </li>
            <li>
              <strong>Favor composition</strong>
              <ul>
                <li>Inheritance is rigid</li>
                <li>Composition allows finer grained control over what parts to implement
                  in what modules</li>
                <li>Example to follow</li>
              </ul>
            </li>
          </ul>
        </aside>
      </section>

      <section>
        <h3>Other Resources</h3>
        <div class='split'>
          <img class='book-cover' src='img/book-covers/clean-code.jpg'></img>
        </div>
        <div class='split'>
          <img class='book-cover' src='img/book-covers/code-complete.jpg'></img>
        </div>
      </section>

      <section>
        <h3>Conclusions</h3>
        <ul>
          <li>Focus on writing maintainable code</li>
          <li>The value of using patterns</li>
          <li>Identifying when to apply a pattern</li>
          <li>Identifying when not to apply a pattern</li>
        </ul>
        <aside class="notes">
          <ul>
            <li>Not the kind of book you read once and put away</li>
            <li>Using frameworks to set patterns</li>
            <li>Being a professional</li>
            <li>Investing in design phase</li>
            <li>Writing less code</li>
          </ul>
        </aside>
      </section>

      <section>
        <h3>Questions?</h3>
      </section>

      <section>
        <h3 class='isolated'>Thank You!</h3> Please fill in your evaluation form.

        <p class='footer'>
          <img class='logo' src='./img/codecamp-logo.png' />
        </p>
      </section>

    </div>
  </div>

  <script src="lib/js/head.min.js"></script>
  <script src="js/reveal.js"></script>

  <script>
    // Full list of configuration options available at:
    // https://github.com/hakimel/reveal.js#configuration
    Reveal.initialize({
      controls: true,
      progress: true,
      history: true,
      center: true,

      transition: 'slide', // none/fade/slide/convex/concave/zoom

      // Optional reveal.js plugins
      dependencies: [{
        src: 'lib/js/classList.js',
        condition: function () {
          return !document.body.classList;
        }
      }, {
        src: 'plugin/markdown/marked.js',
        condition: function () {
          return !!document.querySelector('[data-markdown]');
        }
      }, {
        src: 'plugin/markdown/markdown.js',
        condition: function () {
          return !!document.querySelector('[data-markdown]');
        }
      }, {
        src: 'plugin/highlight/highlight.js',
        async: true,
        condition: function () {
          return !!document.querySelector('pre code');
        },
        callback: function () {
          hljs.initHighlightingOnLoad();
        }
      }, {
        src: 'plugin/zoom-js/zoom.js',
        async: true
      }, {
        src: 'plugin/notes/notes.js',
        async: true
      }]
    });
  </script>

</body>

</html>
<commit_msg>Some slide reorganization and adding duplicate slides where necessary.<commit_after><!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">

  <title>Writing Maintainable JavaScript</title>

  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">

  <link rel="stylesheet" href="css/reveal.css">
  <link rel="stylesheet" href="css/theme/white.css" id="theme">
  <link rel="stylesheet" href="css/custom.css">

  <!-- Code syntax highlighting -->
  <link rel="stylesheet" href="lib/css/zenburn.css">

  <!-- Printing and PDF exports -->
  <script>
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = window.location.search.match(/print-pdf/gi) ?
      'css/print/pdf.css' : 'css/print/paper.css';
    document.getElementsByTagName('head')[0].appendChild(link);
  </script>

  <!--[if lt IE 9]>
		<script src="lib/js/html5shiv.js"></script>
		<![endif]-->
</head>

<body>

  <div class="reveal">

    <!-- Any section element inside of this container is displayed as a slide -->
    <div class="slides">
      <section>
        <img class='sponsors' src='img/sponsors.png'></img>
      </section>

      <section>
        <h3 class='isolated'>Writing Maintainable JavaScript</h3>
        <p>
          <small>by <a href="mailto:<EMAIL>"><NAME></a></small>
        </p>
        <p class='footer'>
          <img class='logo' src='./img/codecamp-logo.png' />
        </p>
        <aside class="notes">
          <ul>
            <li>Solutions PMG</li>
            <li>Mintel</li>
            <li>Responsibility to future programmers</li>
            <li>Comfort can work against us in the long run</li>
            <li>Well written prose</li>
            <li>Design Patterns book</li>
          </ul>
        </aside>
      </section>

      <section>
        <img class='prominent-book-cover' src="img/book-covers/javascript-definitive-guide.jpg" />
        <p class='reference'>
          <a target="_blank"
            href='http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/0596000480'>[1]</a>
        </p>
      </section>

      <section>
        <h3>Modules</h3>
        <ul>
          <li>Modules help us organize our code</li>
          <li>Modules help us avoid polluting the global namespace</li>
        </ul>
        <pre class='tree'>
.
├── css
│   └── style.css
├── index.html
└── js
    ├── app.js
    ├── collections
    │   └── cart.js
    ├── lib
    │   ├── backbone.js
    │   ├── jquery.js
    │   ├── require.js
    │   └── underscore.js
    ├── models
    │   └── item.js
    └── views
        ├── cartcollectionview.js
        ├── itemcollectionview.js
        └── itemview.js
					</pre>
        <p class='reference'>
          <a target="_blank"
            href='https://github.com/javascript-playground/backbone-require-example'>[2]</a>
        </p>
      </section>

      <section>
        <h3>RequireJS</h3>
        <pre><code>
define(["lib/backbone"], function(Backbone) {
  function ItemView() {
    // ...
  });
  return ItemView;
});
          </code></pre>
        <p class='reference'>
          <a target="_blank" href='http://requirejs.org/'>[3]</a>
        </p>
        <aside class="notes">
          <ul>
            <li>Helps with organizing our code into small modules with specific intent</li>
            <li>Helps us avoid polluting the global namespace</li>
          </ul>
        </aside>
      </section>

      <section>
        <pre><code>
define(["lib/backbone", "views/ItemView"]
    function(Backbone, ItemView) {
  function ItemCollectionView () {
    // ...
  });
  return ItemCollectionView;
});
          </code></pre>
      </section>

      <section class='design-patterns-book'>
        <img class='prominent-book-cover' src="img/book-covers/design-patterns.jpg" />
        <p class='reference'>
          <a target="_blank"
             href='http://www.amazon.com/Design-Patterns-Elements-Reusable-Object-Oriented-ebook/dp/B000SEIBB8'>[4]</a>
        </p>
      </section>

      <section class='design-patterns-book'>
        <h3>Design Patterns</h3>
        <div>
          <div>
            <img class='book-cover' src="img/book-covers/design-patterns.jpg" />
          </div>
          <div class='content'>
            <ul>
              <li>One of the most influential books in the field of software engineering.</li>
              <li>Presents 23 essential software design patterns that came out of recurring
                solutions to common problems.</li>
              <li>Changes the way you approach writing software.</li>
            </ul>
          </div>
        </div>
      </section>

      <section>
        <h3>3 Types of Patterns</h3>
        <ol>
          <li><strong>Creational</strong>: help you build objects</li>
          <li><strong>Structural</strong>: help you compose objects</li>
          <li><strong>Behavioral</strong>: help you organize functionality</li>
        </ol>
      </section>

      <section>
        <h3>Sample App: Contacts</h3>
        <ul>
          <li>Add - Mediator Pattern</li>
          <li>Search - Abstract Factory Pattern</li>
          <li>Export - Adapter Pattern</li>
        </ul>
      </section>

      <section>
        <div class='code-link'>
          <div class='link'>
            <a target="_blank" href='https://github.com/paulistoan/writing-maintainable-javascript'>
              https://github.com/paulistoan/writing-maintainable-javascript
            </a>
          </div>
          <div class='link'>
            <a target="_blank" href='http://git.io/v8soT'>
              http://git.io/v8soT
            </a>
          </div>
          <img class='qr' src='img/qr-github-code.jpg'></img>
        </div>
      </section>

      <section>
        <h3>Common Themes</h3>
        <ul>
          <li>Program to interfaces, not to implementations.</li>
          <li>Favor composition over inheritance.</li>
        </ul>
      </section>


      <section>
        <h3>Abstract Factory</h3> &ldquo;Provide an interface for creating families of related or dependent
        objects without specifying their concrete classes.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/abstract-factory.png" />
        <p class='reference'>
          <a target="_blank"
             href='https://www.l2f.inesc-id.pt/~david/wiki/pt/images/thumb/a/a6/Abstract-factory-dpcd.png/1400px-Abstract-factory-dpcd.png'>[5]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/abstract-factory.png' />
        <div><a target="_blank" href="../src/abstract-factory-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/abstract-factory.png" />
      </section>

      <section>
        <h3 class='code'>config.js</h3>
        <pre><code>{
  searchFields: [{
      type: 'range',
      name: 'Age'
  }, {
      type: 'phoneNumber',
      name: 'Phone Number'
  }, {
      type: 'text',
      name: '<NAME>'
  }, {
      type: 'text',
      name: '<NAME>'
  }]
}</code></pre>
      </section>

      <section>
        <h3>Creational Design Patterns</h3>
        <ul>
          <li>Abstract Factory</li>
          <li>Builder</li>
          <li>Factory Method</li>
          <li>Prototype</li>
          <li>Singleton</li>
        </ul>
      </section>

      <section>
        <h3>Adapter</h3> &ldquo;Convert the interface of a class into another interface clients expect.
        Adapter lets classes work together that couldn't otherwise because of incompatible
        interfaces.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/adapter.png" />
        <p class='reference'>
          <a target="_blank"
             href='http://buraktas.com/public/images/2015/01/adapter-design-pattern.png'>[6]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/adapter.png' />
        <div><a target="_blank" href="../src/adapter-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/adapter.png" />
      </section>

      <section>
        <h3>Structural Design Patterns</h3>
        <div class='split'>
          <ul>
            <li>Adapter</li>
            <li>Bridge</li>
            <li>Composite</li>
          </ul>
        </div>
        <div class='split'>
          <ul>
            <li>Decorator</li>
            <li>Facade</li>
            <li>Flyweight</li>
            <li>Proxy</li>
          </ul>
        </div>
      </section>

      <section>
        <h3>Mediator</h3> &ldquo;Define an object that encapsulates how a set of objects interact.
        Mediator promotes loose coupling by keeping objects from referring to each
        other explicitly, and it lets you vary their interaction independently.&rdquo;
      </section>

      <section>
        <img src="./img/design-patterns-formal/mediator.jpg" />
        <p class='reference'>
          <a target="_blank"
             href='http://img.my.csdn.net/uploads/201409/07/1410057502_7783.jpg'>[7]</a>
        </p>
      </section>

      <section>
        <img src='./img/screenshots/mediator.png' />
        <div><a target="_blank" href="../src/mediator-pattern/index.html">Demo</a></div>
      </section>

      <section>
        <img src="./img/design-patterns-applied/mediator-aggregate.png" />
      </section>

      <section>
        <img src="./img/design-patterns-applied/mediator-field.png" />
      </section>

      <section>
        <img src="./img/design-patterns-applied/mediator-aggregate.png" />
      </section>

      <section>
        <img src='./img/screenshots/mediator.png' />
      </section>

      <section>
        <h3>Behavioral Design Patterns</h3>
        <div class='split'>
          <ul>
            <li>Chain of responsibility</li>
            <li>Command</li>
            <li>Interpreter</li>
            <li>Iterator</li>
            <li>Mediator</li>
            <li>Memento</li>
          </ul>
        </div>
        <div class='split'>
          <ul>
            <li>Observer</li>
            <li>State</li>
            <li>Strategy</li>
            <li>Template method</li>
            <li>Visitor</li>
          </ul>
        </div>
      </section>

      <section>
        <h3>Conclusions</h3>
        <ul>
          <li>Program to interfaces, not to implementations.</li>
          <li>Favor composition over inheritance.</li>
        </ul>

        <aside class='notes'>
          <ul>
            <li>
              <strong>Program to interfaces</strong>
              <ul>
                <li>Easy to swap out implementations, configurable</li>
                <li>Maintainable</li>
              </ul>
            </li>
            <li>
              <strong>Favor composition</strong>
              <ul>
                <li>Inheritance is rigid</li>
                <li>Composition allows finer grained control over what parts to implement
                  in what modules</li>
                <li>Example to follow</li>
              </ul>
            </li>
          </ul>
        </aside>
      </section>

      <section>
        <h3>Other Resources</h3>
        <div class='split'>
          <img class='book-cover' src='img/book-covers/clean-code.jpg'></img>
        </div>
        <div class='split'>
          <img class='book-cover' src='img/book-covers/code-complete.jpg'></img>
        </div>

        <aside class="notes">
          <ul>
            <li>Focus on writing maintainable code</li>
            <li>The value of using patterns</li>
            <li>Identifying when to apply a pattern</li>
            <li>Identifying when not to apply a pattern</li>
            <li>Not the kinds of book you read once and put away</li>
            <li>Using frameworks to set patterns</li>
            <li>Being a professional</li>
            <li>Investing in design phase</li>
            <li>Writing less code</li>
          </ul>
        </aside>
      </section>

      <section>
        <div class='code-link'>
          <div class='link'>
            <a target="_blank" href='https://github.com/paulistoan/writing-maintainable-javascript'>
              https://github.com/paulistoan/writing-maintainable-javascript
            </a>
          </div>
          <div class='link'>
            <a target="_blank" href='http://git.io/v8soT'>
              http://git.io/v8soT
            </a>
          </div>
          <img class='qr' src='img/qr-github-code.jpg'></img>
        </div>
      </section>

      <section>
        <h3>Questions?</h3>
      </section>

      <section>
        <h3 class='isolated'>Thank You!</h3> Please fill in your evaluation form.

        <p class='footer'>
          <img class='logo' src='./img/codecamp-logo.png' />
        </p>
      </section>

    </div>
  </div>

  <script src="lib/js/head.min.js"></script>
  <script src="js/reveal.js"></script>

  <script>
    // Full list of configuration options available at:
    // https://github.com/hakimel/reveal.js#configuration
    Reveal.initialize({
      controls: true,
      progress: true,
      history: true,
      center: true,

      transition: 'slide', // none/fade/slide/convex/concave/zoom

      // Optional reveal.js plugins
      dependencies: [{
        src: 'lib/js/classList.js',
        condition: function () {
          return !document.body.classList;
        }
      }, {
        src: 'plugin/markdown/marked.js',
        condition: function () {
          return !!document.querySelector('[data-markdown]');
        }
      }, {
        src: 'plugin/markdown/markdown.js',
        condition: function () {
          return !!document.querySelector('[data-markdown]');
        }
      }, {
        src: 'plugin/highlight/highlight.js',
        async: true,
        condition: function () {
          return !!document.querySelector('pre code');
        },
        callback: function () {
          hljs.initHighlightingOnLoad();
        }
      }, {
        src: 'plugin/zoom-js/zoom.js',
        async: true
      }, {
        src: 'plugin/notes/notes.js',
        async: true
      }]
    });
  </script>

</body>

</html>

{'fraction_non_alphanumeric': 0.15959025079477215, 'fraction_numerical': 0.007488519957612151, 'mean_word_length': 1.828554301128984, 'pattern_counts': {'":': 0, '<': 898, '<?xml version=': 0, '>': 898, 'https://': 12, 'lorem ipsum': 0, 'www.': 6, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5251162', 'n_tokens_mistral': 9091, 'n_tokens_neox': 8703, 'n_words': 1782}