---
layout: base
title: Austin JavaScript
meta:
  description: Austin JavaScript is a community-driven group that meets to discuss JavaScript and the open web.
---
<section class="columns is-variable is-8-desktop">
  <div class="column is-two-thirds">
    <div class="content is-medium">
      <h1 class="is-sr-only">{{ title }}</h1>

      <section class="meetup-details">
        {%- assign meet = collections.meetups | last -%}
        {%- meetupDetails meet.date, meet.data.venue, meet.data.after, meet.data.title, 'Upcoming meetup details' -%}
        <div class="title is-size-4">
          <a href="{{ meet.url }}">{{ meet.data.title }}</a>
        </div>
        {%- endmeetupDetails -%}

        <meta id="meet-date" time="{{ meet.date }}">
<script>
(function () {
  const meetDate = document.getElementById('meet-date').getAttribute('time');
  if (new Date(meetDate) < new Date()) {
    // We may want to post an alternate message, but for now just delete the upcoming meetup.
    document.querySelector('.meetup-details').remove();
  }
}());
</script>
      </section>

      <section class="section">
        <p>We are a community-driven group that meets to discuss JavaScript and the open web. Find out more <a href="{{ '/about/' | url }}">about us</a> or the many ways you can <a href="{{ '/contributing/' | url }}">contribute</a>.</p>
        <p>We work hard to build a community that treats people with excellence. We've formalized this in the <a href="{{ '/code-of-conduct/' | url }}">Austin JavaScript Code of Conduct</a>.</p>
      </section>

      <section class="section">
        <h2 class="is-size-4">Past speakers and talks</h2>
        {%- for meetup in collections.meetups reversed -%}
        {%- for speaker in meetup.data.speakers -%}
        {%- if speaker.name and speaker.avatar -%}
        <figure class="pic">
          <a class="tooltip" href="{{ meetup.url | url }}" aria-label="{{ speaker.name }}: &quot;{{ meetup.data.title }}&quot;">
            {%- avatar speaker.avatar, speaker.name, 'is-rounded' -%}
          </a>
        </figure>
        {%- endif -%}
        {%- endfor -%}
        {%- endfor -%}
      </section>
    </div>
  </div>

  <div class="column">
    <div class="content">
      <h3>Recent meetups</h3>
      <ul>
        {%- assign meetups = collections.meetups | flip -%}
        {%- for post in meetups limit: 5 -%}
        <li><a href="{{ post.url | url }}">{{ post.data.title }}</a></li>
        {%- endfor -%}
      </ul>
      <p><a href="{{ '/posts/meetups/' | url }}">More in archive...</a></p>
    </div>
  </div>
</section>