diff --git a/pac-man-board-game/ClientApp/.env.development b/pac-man-board-game/ClientApp/.env.development
index b5019a3..431b2b1 100644
--- a/pac-man-board-game/ClientApp/.env.development
+++ b/pac-man-board-game/ClientApp/.env.development
@@ -1,3 +1,3 @@
 PORT=44435
 HTTPS=true
-
+VITE_API=wss://localhost:3000/api/game
diff --git a/pac-man-board-game/ClientApp/src/components/gameComponent.tsx b/pac-man-board-game/ClientApp/src/components/gameComponent.tsx
index 624ae6f..7e362bc 100644
--- a/pac-man-board-game/ClientApp/src/components/gameComponent.tsx
+++ b/pac-man-board-game/ClientApp/src/components/gameComponent.tsx
@@ -5,28 +5,25 @@ import GameBoard from "./gameBoard";
 import {Character, Ghost, PacMan} from "../game/character";
 import WebSocketService from "../websockets/WebSocketService";
 import {testMap} from "../game/map";
-import {Direction} from "../game/direction";
 import {TileType} from "../game/tileType";
 import Player from "../game/player";
 
-const wsService = new WebSocketService("wss://localhost:3000/api/game");
+const wsService = new WebSocketService(import.meta.env.VITE_API);
+
+const ghosts = [
+  new Ghost({Colour: "purple"}),
+  new Ghost({Colour: "purple"})
+];
 
 export const GameComponent: Component<{ player: Player }> = (
   {
     player = new Player({
-      name: "Martin",
-      colour: "yellow",
+      Name: "Martin",
+      Colour: "yellow",
     })
   }) => {
   // TODO find spawn points
-  const [characters, setCharacters] = useState([
-    new Ghost({
-      colour: "purple", spawnPosition: {At: {x: 7, y: 3}, Direction: Direction.up}
-    }),
-    new Ghost({
-      colour: "purple", spawnPosition: {At: {x: 3, y: 7}, Direction: Direction.down}
-    })
-  ]);
+  const [characters, setCharacters] = useState<Character[]>();
 
   const [dice, setDice] = useState<number[]>();
   const [selectedDice, setSelectedDice] = useState<SelectedDice>();
@@ -64,8 +61,11 @@ export const GameComponent: Component<{ player: Player }> = (
         removeEatenPellets(parsed);
         break;
       case GameAction.playerInfo:
-        const players = parsed.Data as Player[];
-        // TODO set all characters
+        const players = parsed.Data as PlayerProps[];
+        const pacMen = players.filter(p => p.PacMan).map(p => new PacMan(p.PacMan!));
+        console.log(pacMen);
+        // TODO find spawn points
+        setCharacters([...pacMen, ...ghosts]);
         break;
     }
   }
@@ -129,15 +129,19 @@ export const GameComponent: Component<{ player: Player }> = (
       </div>
       <AllDice values={dice} onclick={handleDiceClick} selectedDiceIndex={selectedDice?.index}/>
       {
-        (characters.filter(c => c instanceof PacMan) as PacMan[]).map(c =>
+        (characters?.filter(c => c.isPacMan()) as PacMan[] | undefined)?.map(c =>
           <div key={c.Colour} className={"mx-auto w-fit m-2"}>
             <p className={currentPlayer === player ? "underline" : ""}>Player: {player.Colour}</p>
             <p>Pellets: {player.Box.count}</p>
             <p>PowerPellets: {player.Box.countPowerPellets}</p>
           </div>)
       }
-      <GameBoard className={"mx-auto my-2"} characters={characters} selectedDice={selectedDice}
-                 onMove={onCharacterMove} map={testMap}/>
+      {characters &&
+        <GameBoard className={"mx-auto my-2"}
+                   characters={characters}
+                   selectedDice={selectedDice}
+                   onMove={onCharacterMove} map={testMap}/>
+      }
     </div>
   );
 };
diff --git a/pac-man-board-game/ClientApp/src/game/character.ts b/pac-man-board-game/ClientApp/src/game/character.ts
index 8eb29a3..559e3f6 100644
--- a/pac-man-board-game/ClientApp/src/game/character.ts
+++ b/pac-man-board-game/ClientApp/src/game/character.ts
@@ -15,21 +15,21 @@ export class Character {
 
   public constructor(
     {
-      colour,
-      position = null,
-      type = CharacterType.dummy,
-      isEatable = type === CharacterType.pacMan,
-      spawnPosition = null
+      Colour,
+      Position = null,
+      Type = CharacterType.dummy,
+      IsEatable = Type === CharacterType.pacMan,
+      SpawnPosition = null
     }: CharacterProps) {
-    this.Colour = colour;
-    this.IsEatable = isEatable;
-    this.SpawnPosition = spawnPosition;
+    this.Colour = Colour;
+    this.IsEatable = IsEatable;
+    this.SpawnPosition = SpawnPosition;
 
-    this.Position = position ?? spawnPosition ? {
-      End: spawnPosition!.At,
-      Direction: spawnPosition!.Direction
+    this.Position = Position ?? SpawnPosition ? {
+      End: SpawnPosition!.At,
+      Direction: SpawnPosition!.Direction
     } : null;
-    this.Type = type;
+    this.Type = Type;
   }
 
   public follow(path: Path): void {
@@ -62,16 +62,16 @@ export class Character {
 
 export class PacMan extends Character {
 
-  public constructor({colour, position, isEatable = true, spawnPosition, type = CharacterType.pacMan}: CharacterProps) {
-    super({colour, position, isEatable, spawnPosition, type});
+  public constructor({Colour, Position, IsEatable = true, SpawnPosition, Type = CharacterType.pacMan}: CharacterProps) {
+    super({Colour: Colour, Position: Position, IsEatable: IsEatable, SpawnPosition: SpawnPosition, Type: Type});
   }
 
 }
 
 export class Ghost extends Character {
 
-  public constructor({colour, position, isEatable, spawnPosition, type = CharacterType.ghost}: CharacterProps) {
-    super({colour, position, isEatable, spawnPosition, type});
+  public constructor({Colour, Position, IsEatable, SpawnPosition, Type = CharacterType.ghost}: CharacterProps) {
+    super({Colour: Colour, Position: Position, IsEatable: IsEatable, SpawnPosition: SpawnPosition, Type: Type});
   }
 }
 
@@ -79,11 +79,11 @@ export class Dummy extends Character {
 
   public constructor(position: Path) { // TODO see-through
     super({
-      colour: "grey",
-      position,
-      isEatable: false,
-      spawnPosition: {At: {x: 0, y: 0}, Direction: Direction.up},
-      type: CharacterType.dummy,
+      Colour: "grey",
+      Position: position,
+      IsEatable: false,
+      SpawnPosition: {At: {x: 0, y: 0}, Direction: Direction.up},
+      Type: CharacterType.dummy,
     });
   }
 
diff --git a/pac-man-board-game/ClientApp/src/game/player.ts b/pac-man-board-game/ClientApp/src/game/player.ts
index 79c29ca..0e0b63d 100644
--- a/pac-man-board-game/ClientApp/src/game/player.ts
+++ b/pac-man-board-game/ClientApp/src/game/player.ts
@@ -8,12 +8,12 @@ export default class Player {
   public readonly Box: Box;
 
   constructor(props: PlayerProps) {
-    this.Name = props.name;
-    this.Colour = props.colour;
-    this.Box = new Box(props.box ?? {colour: props.colour});
-    this.PacMan = new Character(props.pacMan ?? {
-      colour: props.colour,
-      type: CharacterType.pacMan
+    this.Name = props.Name;
+    this.Colour = props.Colour;
+    this.Box = new Box(props.Box ?? {colour: props.Colour});
+    this.PacMan = new Character(props.PacMan ?? {
+      Colour: props.Colour,
+      Type: CharacterType.pacMan
     });
   }
 
diff --git a/pac-man-board-game/ClientApp/src/types/props.d.ts b/pac-man-board-game/ClientApp/src/types/props.d.ts
index 0105230..e3b15dc 100644
--- a/pac-man-board-game/ClientApp/src/types/props.d.ts
+++ b/pac-man-board-game/ClientApp/src/types/props.d.ts
@@ -12,11 +12,11 @@ interface ChildProps extends ComponentProps {
 }
 
 interface CharacterProps {
-  colour: Colour,
-  position?: Path | null,
-  isEatable?: boolean,
-  spawnPosition?: DirectionalPosition | null,
-  type?: import("../game/character").CharacterType,
+  Colour: Colour,
+  Position?: Path | null,
+  IsEatable?: boolean,
+  SpawnPosition?: DirectionalPosition | null,
+  Type?: import("../game/character").CharacterType,
 }
 
 interface BoxProps {
@@ -25,8 +25,8 @@ interface BoxProps {
 }
 
 interface PlayerProps {
-  readonly name: string,
-  readonly pacMan?: CharacterProps,
-  readonly colour: Colour,
-  readonly box?: BoxProps,
+  readonly Name: string,
+  readonly PacMan?: CharacterProps,
+  readonly Colour: Colour,
+  readonly Box?: BoxProps,
 }
diff --git a/pac-man-board-game/ClientApp/src/vite-env.d.ts b/pac-man-board-game/ClientApp/src/vite-env.d.ts
index 11f02fe..8457fb4 100644
--- a/pac-man-board-game/ClientApp/src/vite-env.d.ts
+++ b/pac-man-board-game/ClientApp/src/vite-env.d.ts
@@ -1 +1,9 @@
 /// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly VITE_API: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv;
+}
\ No newline at end of file
diff --git a/pac-man-board-game/ClientApp/tests/game/possibleMovesAlgorithm.test.ts b/pac-man-board-game/ClientApp/tests/game/possibleMovesAlgorithm.test.ts
index b4b761f..fdbc33a 100644
--- a/pac-man-board-game/ClientApp/tests/game/possibleMovesAlgorithm.test.ts
+++ b/pac-man-board-game/ClientApp/tests/game/possibleMovesAlgorithm.test.ts
@@ -8,7 +8,7 @@ let pacMan: Character;
 
 beforeEach(() => {
   pacMan = new PacMan({
-    colour: "yellow", spawnPosition: {At: {x: 3, y: 3}, Direction: Direction.up}
+    Colour: "yellow", SpawnPosition: {At: {x: 3, y: 3}, Direction: Direction.up}
   });
 });