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