index.html

---
layout: basic
headline: Willkommen auf Squeak.de
welcome: >
  Squeak ist eine moderne, multimediale Programmierumgebung, die auf der
  Programmiersprache Smalltalk basiert. Squeak ist
  <a href="http://de.wikipedia.org/wiki/Open-Source">frei und quelloffen</a>
  und unterstützt alle gängigen Betriebssysteme.<br>
  
  Die Squeak-Oberfläche baut auf dem Morphic-Framework auf, mit dem
  interaktive, multimediale Benutzeroberflächen mit geringem Aufwand
  entwickelt und gewartet werden können. Für Neulinge bietet die auf
  Squeak-basierte Etoys-Umgebung einen Entwicklungsansatz, mit der
  Kinder jeden Alters Simulationen, Spiele, interaktive Bücher und
  noch viel mehr erstellen können.<br>
  
  Zu der Vielzahl von in Squeak umgesetzten Anwendungen zählen
  Projekte aus verschiedensten Bereichen wie beispielsweise
  Bildung, Multimedia, Computerspiele, Wissenschaft und Industrie.

screenshots:
  - img-src: img/screenshots/writing.png
    caption: "Werkzeuge zur Verwaltung, zum Lesen, Schreiben und zur Ausführung von Smalltalk-Quelltext"

  - img-src: img/screenshots/executing.png
    caption: "Laufzeitdaten in simultanen Debugging-Aktivitäten mit Live-Programming-Unterstützung"

  - img-src: img/screenshots/scripting.png
    caption: "Fast alles in der Programmierumgebung ist sichtbar und kann interaktiv programmiert werden"

  - img-src: img/screenshots/versioning.png
    caption: "Werkzeuge zur automatischen Änderungsverfolgung und Versionierung von Quelltext"

  - img-src: img/screenshots/tools.png
    caption: "Verschiedene personalisierbare Farbdesigns und Einstellungen"

  - img-src: img/screenshots/applications.png
    caption: "Ausdrucksstarke Sprache, leistungsstarke Werkzeuge und direkte Manipulation für kreative Projekte"

  - img-src: img/screenshots/etoys.png
    caption: "Pädagogische Werkzeuge für die Vermittlung überzeugender Ideen auf überzeugende Weise"
---
<div class="alert alert-info text-center" role="alert">
  <b>Nächstes Squeak-Treffen am 02.11.2024 (hybrid) 🐭 <a href="/news/">Mehr erfahren...</a></b>
</div>

<div class="container">
  <div class="row">
    <div class="col-md-6 col-lg-6">
      <img id="squeak-logo" src="/static/img/balloon.svg" alt="" class="img-responsive img-center">
    </div>
    <div lang="de" id="welcome-text" class="col-md-6 col-lg-6">
      <h2>{{ page.headline }}</h2>
      <div>{{ page.welcome }}</div>
      <div class="text-center">
        <a id="download-button" class="btn btn-primary" href="/downloads/" role="button">
          <i class="fa fa-windows fa-lg"></i>
          <i class="fa fa-apple fa-lg"></i>
          <i class="fa fa-linux fa-lg"></i>
         Herunterladen
        </a>

        <div id="sub-button-group" class="btn-group btn-group-sm" role="group" aria-label="...">
          {% for button in page.sub_button_group %}
          <a class="{% if button.class %}{{ button.class }} {% endif %}btn btn-default" href="{% if button.href %}{{ button.href }}{% else %}#{% endif %}" target="_blank" role="button">
            <i class="fa fa-{{ button.icon }}"></i>
            {{ button.title }}
          </a>
          {% endfor %}
        </div>
      </div>
    </div>
  </div> <!-- /row -->
</div> <!-- /container -->

<div id="screnshot-wrapper">
  <div class="container">
    <div id="screenshots" class="row">
      {% for screenshot in page.screenshots %}
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 text-center slideshow-item" style="{{ currentStyle }}">
        <a href="#" class="screenshot-img">
          <img src="{{ screenshot.img-src }}" alt="" class="img-responsive img-center">
        </a>
        <p class="lead">
          {{ screenshot.caption }}
          <a href="#" class="screenshot-button pull-left" data-target="left">
            <i class="fa fa-chevron-left"></i>
          </a>
          <a href="#" class="screenshot-button pull-right" data-target="right">
            <i class="fa fa-chevron-right"></i>
          </a>
        </p>
      </div>
        {% assign currentStyle = "display: none" %}
      {% endfor %}
    </div>
  </div>
</div>

{% for section in site.collections %}
  {% if section.label == "posts" %}
    {% continue %}
  {% endif %}
  {% if section.hidden == nil or section.hidden == false %}
    {% assign items = section.docs | where: 'front-page', true | sort: 'order' %}
    {% if items != empty %}
    <div class="container">
      <div class="section">
        <span class="anchor" id="{{ section.title | slugify }}"></span>
        {% if section.mobile-title %}
        <h1 class="section-heading hidden-xs"><span>{{ section.title }}</span></h1>
        <h1 class="section-heading visible-xs"><span>{{ section.mobile-title }}</span></h1>
        {% else %}
        <h1 class="section-heading"><span>{{ section.title }}</span></h1>
        {% endif %}
        {% include row.html items=items preview=true %}

        {% assign totalCount = section.docs | size %}
        {% assign itemsCount = items | size %}
        {% if totalCount > itemsCount %}
        <div class="row">
          <div class="col-sm-12 col-md-12 col-lg-12 text-center section-tail">
            <p class="lead"><a href="/{{ section.label }}/"><b>Mehr...</b></a></p>
          </div>
        </div>
        {% endif %}
      </div><!-- /.section -->
    </div><!-- /.container -->
    {% endif %}
  {% endif %}
{% endfor %}