Hello World

This only exists to test out the mdx & prism shiki twoslash Rehype Pretty Code stuff. Also happens to be a list of languages and / or frameworks I’ve used - not a list of languages I know and not in any particular order.

typescript
          ;((console as any).log as any)('Hello, World!' as any)
javascript
          console.log('Hello, World!')
SolidJS (TypeScript)
tsx
          import type { Component } from 'solid-js'
import { createSignal } from 'solid-js'
import { render } from 'solid-js/web'
 
const App: Component = () => {
  const [message, setMessage] = createSignal('Hello, World!')
 
  return <div>{message()}</div>
}
 
render(() => <App />, document.getElementById('root'))
SolidJS (JavaScript)
jsx
          import { createSignal } from 'solid-js'
import { render } from 'solid-js/web'
 
const App = () => {
  const [message, setMessage] = createSignal('Hello, World!')
 
  return <div>{message()}</div>
}
 
render(() => <App />, document.getElementById('root'))
Vue 3 (script setup)
vue
          <template>
  <div>{{ message }}</div>
</template>
 
<script setup lang="ts">
import { ref } from 'vue'
 
const message = ref('Hello, World!')
</script>
Vue 2.7/3 (Composition API)
vue
          <template>
  <div>{{ message }}</div>
</template>
 
<script lang="ts">
import { defineComponent, ref } from 'vue'
 
export default defineComponent({
  setup() {
    const message = ref('Hello, World!')
 
    return {
      message,
    }
  },
})
</script>
Vue 2/3 (Options API)
vue
          <template>
  <div>{{ message }}</div>
</template>
 
<script lang="ts">
import { defineComponent, ref } from 'vue'
 
export default defineComponent({
  data() {
    return {
      message: 'Hello, World!',
    }
  },
})
</script>
React (TypeScript)
tsx
          import type { FC } from 'react'
import { useState } from 'react'
import { render } from 'react-dom'
 
const App: FC = () => {
  const [message, setMessage] = useState('Hello, World!')
 
  return <div>{message}</div>
}
 
render(<App />, document.getElementById('root'))
React (JavaScript)
jsx
          import { useState } from 'react'
import { render } from 'react-dom'
 
const App = () => {
  const [message, setMessage] = useState('Hello, World!')
 
  return <div>{message}</div>
}
 
render(<App />, document.getElementById('root'))
bash
          echo 'Hello, World!'
perl
          print 'Hello, World!\n';
python
          print('Hello, World!')
c
          #include <stdio.h>
 
int main(void) {
  printf("Hello, World!\n");
  return 0;
}
go
          import (
  "fmt"
)
 
func main() {
  fmt.Println("Hello, World!")
}
java
          public class WHYYYYYY {
  public static void main(String[] args) {
    System.out.println("Hello, World!");
  }
}
kotlin
          fun main() {
  println("Hello, World!")
}
sql
          SELECT "Hello, World!";
css
          body::after {
  content: 'Hello, World!';
}
markdown
          Hello, World!
html
          <!DOCTYPE html>
<html lang="en">
  <head>
    <title>Hello, World!</title>
  </head>
  <body>
    Hello, World!
  </body>
</html>
rust
          fn main() {
  println!("Hello, World!")
}
cpp
          #include <iostream>
 
auto main() -> int {
  std::cout << "Hello, World!\n";
}
csharp
          using System;
 
Console.WriteLine("Hello, World!");
haskell
          main = putStrLn "Hello, World!"
latex
          \begin{document}
Hello, World!
\end{document}
r
          print("Hello, World!")
matlab
          disp 'Hello, World!'
json
          {
  "message": "Hello, World!"
}
yaml
          message: 'Hello, World!'
toml
          message = "Hello, World!"
Created 24/03/21 • Updated 02/10/23