init slides

.gitignore

+node_modules

slides/README.md

+# Welcome to [Slidev](https://github.com/slidevjs/slidev)!
+
+To start the slide show:
+
+- `npm install`
+- `npm run dev`
+- visit http://localhost:3030
+
+Edit the [slides.md](./slides.md) to see the changes.
+
+Learn more about Slidev on [documentations](https://sli.dev/).

slides/components/Counter.vue

+<script setup lang="ts">
+import { ref } from 'vue'
+
+const props = defineProps({
+  count: {
+    default: 0,
+  },
+})
+
+const counter = ref(props.count)
+</script>
+
+<template>
+  <div flex="~" w="min" border="~ main rounded-md">
+    <button
+      border="r main"
+      p="2"
+      font="mono"
+      outline="!none"
+      hover:bg="gray-400 opacity-20"
+      @click="counter -= 1"
+    >
+      -
+    </button>
+    <span m="auto" p="2">{{ counter }}</span>
+    <button
+      border="l main"
+      p="2"
+      font="mono"
+      outline="!none"
+      hover:bg="gray-400 opacity-20"
+      @click="counter += 1"
+    >
+      +
+    </button>
+  </div>
+</template>

slides/package.json

+{
+  "name": "tutorial-1",
+  "private": true,
+  "scripts": {
+    "build": "slidev build",
+    "dev": "slidev --open",
+    "export": "slidev export"
+  },
+  "dependencies": {
+    "@slidev/cli": "^0.40.14",
+    "@slidev/theme-default": "*",
+    "@slidev/theme-seriph": "*"
+  }
+}
\ No newline at end of file

slides/pages/env.md

+---
+title: Development Environment
+---
+
+# Development Environment Setup
+
+- Access to Linux Pool (Andorra)
+- SSH Key Authentication - Safe and quick
+
+<div class="container flex justify-center mt-xs mb-xs">
+    <img src="/images/ssh-key-auth-flow.png" class="block w-m"/>
+</div>
+
+- Verify `git` and `gcc` or `clang` Installation
+
+## Configure SSH ()
+
+Follow the steps in: https://git.imp.fu-berlin.de/mactavish96/alp4-tutorials/-/blob/tutorial-1/env.md

slides/pages/git.md

+---
+title: Git Basics
+layout: two-cols
+---
+
+# Git Basics
+
+- Create a new repo: `git init`
+- Clone an existing repo: `git clone <repo url>`
+- Making Changes:
+    - Propose changes: `git add <filename>`
+    - Commit changes: `git commit -m "your commit message"`
+- Pushing Changes: `git push origin main`
+- Pulling Changes: `git pull origin main`
+
+## Git With Me
+
+Live demo
+
+::right::
+
+<div class="container flex justify-center mt-25">
+    <img src="/images/git-three-states.png" class="block w-xs"/>
+</div>
+

slides/pages/intro.md

+---
+title: Introduction
+layout: center
+---
+
+# What's your favourite ...
+
+Introduce yourself with one sentence and ask the person next to you with the question:
+
+**What's your favourite ...**

slides/pages/orga.md

+---
+title: Organization
+---
+
+# Organization
+
+E-Mail: chao.zhan@fu-berlin.de
+
+### Active Participation
+
+- Participate in group discussions
+- Present your solution to one of the questions from the assignments at least twice (officially, but adjustable)
+
+<br />
+
+### Assignments
+
+- For programming assignments, commit your code on GitLab
+- Code should be able to compiled and executed on Andorra
+- For writing assignments, please use the latex template
+
+<br />
+
+### Roles
+
+- Mine: Offering helps, answering questions
+- Yours: Thinking & Getting your hands dirty (coding, tooling)

slides/slides.md

+---
+# try also 'default' to start simple
+theme: seriph
+# apply any windi css classes to the current slide
+class: 'text-center'
+# https://sli.dev/custom/highlighters.html
+highlighter: shiki
+# show line numbers in code blocks
+lineNumbers: true
+# persist drawings in exports and build
+drawings:
+  persist: false
+# page transition
+transition: fade-out
+# use UnoCSS
+css: unocss
+---
+
+# ALP4 Tutorial 1
+
+## Chao Zhan
+
+<div class="abs-br m-6 flex gap-2">
+  <a href="https://github.com/slidevjs/slidev" target="_blank" alt="GitHub"
+    class="text-xl icon-btn opacity-50 !border-none !hover:text-white">
+    <carbon-logo-github />
+  </a>
+</div>
+
+<!---->
+
+---
+transition: slide-left
+src: ./pages/intro.md
+---
+
+---
+transition: slide-left
+src: ./pages/orga.md
+---
+
+---
+transition: slide-left
+src: ./pages/env.md
+---
+
+---
+transition: slide-left
+src: ./pages/git.md
+---
+
+---
+transition: slide-left
+src: ./pages/clang.md
+---