diff --git a/.eslintrc b/.eslintrc
index 5c5387ff7..b7cd56760 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -12,6 +12,7 @@
   ],
   "parser": "@typescript-eslint/parser",
   "rules": {
+    "@typescript-eslint/explicit-function-return-type": "error",
     "@typescript-eslint/no-explicit-any": "error",
     "@typescript-eslint/no-empty-function": "error",
     // Enforce return types on exported functions or public methods
diff --git a/sandpack-client/src/client.ts b/sandpack-client/src/client.ts
index db0660876..f43faa83c 100644
--- a/sandpack-client/src/client.ts
+++ b/sandpack-client/src/client.ts
@@ -348,7 +348,7 @@ export class SandpackClient {
       this.dispatch({ type: "get-transpiler-context" });
     });
 
-  private getFiles() {
+  private getFiles(): SandpackBundlerFiles {
     const { sandboxInfo } = this;
 
     if (sandboxInfo.files["/package.json"] === undefined) {
@@ -363,7 +363,7 @@ export class SandpackClient {
     return this.sandboxInfo.files;
   }
 
-  private initializeElement() {
+  private initializeElement(): void {
     this.iframe.style.border = "0";
     this.iframe.style.width = this.options.width || "100%";
     this.iframe.style.height = this.options.height || "100%";
diff --git a/sandpack-client/src/iframe-protocol.ts b/sandpack-client/src/iframe-protocol.ts
index 6e7f7f025..625b7dead 100644
--- a/sandpack-client/src/iframe-protocol.ts
+++ b/sandpack-client/src/iframe-protocol.ts
@@ -77,7 +77,7 @@ export class IFrameProtocol {
   // This is needed for the `initialize` message which comes without a channelId
   globalListen(listener: ListenerFunction): UnsubscribeFunction {
     if (typeof listener !== "function") {
-      return () => {
+      return (): void => {
         return;
       };
     }
@@ -85,7 +85,7 @@ export class IFrameProtocol {
     const listenerId = this.globalListenersCount;
     this.globalListeners[listenerId] = listener;
     this.globalListenersCount++;
-    return () => {
+    return (): void => {
       delete this.globalListeners[listenerId];
     };
   }
@@ -94,7 +94,7 @@ export class IFrameProtocol {
   // All other messages (eg: from other iframes) are ignored
   channelListen(listener: ListenerFunction): UnsubscribeFunction {
     if (typeof listener !== "function") {
-      return () => {
+      return (): void => {
         return;
       };
     }
@@ -102,13 +102,13 @@ export class IFrameProtocol {
     const listenerId = this.channelListenersCount;
     this.channelListeners[listenerId] = listener;
     this.channelListenersCount++;
-    return () => {
+    return (): void => {
       delete this.channelListeners[listenerId];
     };
   }
 
   // Handles message windows coming from iframes
-  private eventListener(message: MessageEvent) {
+  private eventListener(message: MessageEvent): void {
     if (!message.data.codesandbox) {
       return;
     }
diff --git a/sandpack-client/src/utils.ts b/sandpack-client/src/utils.ts
index a4294c9cc..f6ca14920 100644
--- a/sandpack-client/src/utils.ts
+++ b/sandpack-client/src/utils.ts
@@ -81,7 +81,9 @@ export function extractErrorDetails(msg: SandpackErrorMessage): SandpackError {
   };
 }
 
-function getRelevantStackFrame(frames?: ErrorStackFrame[]) {
+function getRelevantStackFrame(
+  frames?: ErrorStackFrame[]
+): ErrorStackFrame | undefined {
   if (!frames) {
     return;
   }
@@ -89,13 +91,13 @@ function getRelevantStackFrame(frames?: ErrorStackFrame[]) {
   return frames.find((frame) => !!frame._originalFileName);
 }
 
-function getErrorLocation(errorFrame: ErrorStackFrame) {
+function getErrorLocation(errorFrame: ErrorStackFrame): string {
   return errorFrame
     ? ` (${errorFrame._originalLineNumber}:${errorFrame._originalColumnNumber})`
     : ``;
 }
 
-function getErrorInOriginalCode(errorFrame: ErrorStackFrame) {
+function getErrorInOriginalCode(errorFrame: ErrorStackFrame): string {
   const lastScriptLine =
     errorFrame._originalScriptCode[errorFrame._originalScriptCode.length - 1];
   const numberOfLineNumberCharacters =
@@ -138,7 +140,7 @@ function formatErrorMessage(
   message: string,
   location: string,
   errorInCode: string
-) {
+): string {
   return `${filePath}: ${message}${location}
 ${errorInCode}`;
 }
diff --git a/sandpack-react/src/common/RunButton.tsx b/sandpack-react/src/common/RunButton.tsx
index a6af38188..40101f9f4 100644
--- a/sandpack-react/src/common/RunButton.tsx
+++ b/sandpack-react/src/common/RunButton.tsx
@@ -14,7 +14,7 @@ export const RunButton: React.FC = () => {
   return (
     <button
       className={c("button")}
-      onClick={() => sandpack.runSandpack()}
+      onClick={(): void => sandpack.runSandpack()}
       style={{
         position: "absolute",
         bottom: "var(--sp-space-2)",
diff --git a/sandpack-react/src/components/CodeEditor/CodeMirror.stories.tsx b/sandpack-react/src/components/CodeEditor/CodeMirror.stories.tsx
index 2682b3ff6..98dcb301b 100644
--- a/sandpack-react/src/components/CodeEditor/CodeMirror.stories.tsx
+++ b/sandpack-react/src/components/CodeEditor/CodeMirror.stories.tsx
@@ -16,7 +16,7 @@ export const JustEditor: React.FC = () => (
       <CodeEditor
         code="const c = a+b;"
         fileType="jsx"
-        onCodeUpdate={() => console.log("code update")}
+        onCodeUpdate={(): void => console.log("code update")}
       />
     </SandpackThemeProvider>
   </SandpackProvider>
diff --git a/sandpack-react/src/components/CodeEditor/CodeMirror.tsx b/sandpack-react/src/components/CodeEditor/CodeMirror.tsx
index a16ca90a7..89bd112e0 100644
--- a/sandpack-react/src/components/CodeEditor/CodeMirror.tsx
+++ b/sandpack-react/src/components/CodeEditor/CodeMirror.tsx
@@ -67,7 +67,7 @@ interface CodeMirrorProps {
   editorState?: SandpackEditorState;
   readOnly?: boolean;
   decorators?: Decorators;
-  initMode: SandpackInitMode;
+  initMode?: SandpackInitMode;
 }
 
 export interface CodeMirrorRef {
@@ -109,10 +109,10 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
     });
 
     React.useImperativeHandle(ref, () => ({
-      getCodemirror: () => cmView.current,
+      getCodemirror: (): EditorView | undefined => cmView.current,
     }));
 
-    const shouldInitEditor = () => {
+    const shouldInitEditor = (): boolean => {
       if (initMode === "immediate") {
         return true;
       }
@@ -151,7 +151,7 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
           },
           {
             key: "Escape",
-            run: () => {
+            run: (): boolean => {
               if (readOnly) return true;
 
               if (wrapper.current) {
@@ -218,7 +218,7 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
         const view = new EditorView({
           state: startState,
           parent: parentDiv,
-          dispatch: (tr) => {
+          dispatch: (tr): void => {
             view.update([tr]);
 
             if (tr.docChanged) {
@@ -242,7 +242,7 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
         cmView.current = view;
       }, 0);
 
-      return () => {
+      return (): void => {
         cmView.current?.destroy();
 
         clearTimeout(timer);
@@ -278,7 +278,7 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
 
     React.useEffect(
       function messageToInlineError() {
-        if (!showInlineErrors) return () => null;
+        if (!showInlineErrors) return;
 
         const unsubscribe = listen((message) => {
           const view = cmView.current;
@@ -319,12 +319,12 @@ export const CodeMirror = React.forwardRef<CodeMirrorRef, CodeMirrorProps>(
           }
         });
 
-        return () => unsubscribe();
+        return (): void => unsubscribe();
       },
       [listen, showInlineErrors]
     );
 
-    const handleContainerKeyDown = (evt: React.KeyboardEvent) => {
+    const handleContainerKeyDown = (evt: React.KeyboardEvent): void => {
       if (evt.key === "Enter" && cmView.current) {
         evt.preventDefault();
         cmView.current.contentDOM.focus();
diff --git a/sandpack-react/src/components/CodeEditor/highlightDecorators.ts b/sandpack-react/src/components/CodeEditor/highlightDecorators.ts
index 312231420..0ed76708f 100644
--- a/sandpack-react/src/components/CodeEditor/highlightDecorators.ts
+++ b/sandpack-react/src/components/CodeEditor/highlightDecorators.ts
@@ -15,11 +15,11 @@ export function highlightDecorators(positions: Decorators): Extension {
         this.decorations = this.getDecoration(view);
       }
 
-      update(update: ViewUpdate) {
+      update(update: ViewUpdate): void {
         return;
       }
 
-      getDecoration(view: EditorView) {
+      getDecoration(view: EditorView): DecorationSet {
         if (!positions) return Decoration.none;
 
         const rangesDecorators = positions.map((item) => {
diff --git a/sandpack-react/src/components/CodeEditor/highlightInlineError.ts b/sandpack-react/src/components/CodeEditor/highlightInlineError.ts
index 8653f35bc..2fde4a54d 100644
--- a/sandpack-react/src/components/CodeEditor/highlightInlineError.ts
+++ b/sandpack-react/src/components/CodeEditor/highlightInlineError.ts
@@ -18,7 +18,7 @@ const activeLineHighlighter = ViewPlugin.fromClass(
       this.decorations = Decoration.none;
     }
 
-    update(update: ViewUpdate) {
+    update(update: ViewUpdate): void {
       let message = null;
 
       update.transactions.forEach((trans) => {
@@ -47,7 +47,7 @@ const activeLineHighlighter = ViewPlugin.fromClass(
     getDecoration(
       view: EditorView,
       message: { type: "clean-error" } | { type: "error"; value: number } | null
-    ) {
+    ): DecorationSet {
       if (message === null || message.type === "clean-error") {
         return Decoration.none;
       }
diff --git a/sandpack-react/src/components/CodeEditor/index.tsx b/sandpack-react/src/components/CodeEditor/index.tsx
index ad1c7cfd7..e08e9015d 100644
--- a/sandpack-react/src/components/CodeEditor/index.tsx
+++ b/sandpack-react/src/components/CodeEditor/index.tsx
@@ -58,7 +58,7 @@ export const SandpackCodeEditor = React.forwardRef<
 
     const c = useClasser("sp");
 
-    const handleCodeUpdate = (newCode: string) => {
+    const handleCodeUpdate = (newCode: string): void => {
       updateCode(newCode);
     };
 
diff --git a/sandpack-react/src/components/CodeViewer/CodeViewer.stories.tsx b/sandpack-react/src/components/CodeViewer/CodeViewer.stories.tsx
index 2501f40d7..62c2a7932 100644
--- a/sandpack-react/src/components/CodeViewer/CodeViewer.stories.tsx
+++ b/sandpack-react/src/components/CodeViewer/CodeViewer.stories.tsx
@@ -65,7 +65,7 @@ export const Decorators: React.FC = () => {
   const ref = useRef<HTMLDivElement>();
 
   useEffect(() => {
-    const handle = (event) => {
+    const handle = (event): void => {
       let id = event.target.dataset.id;
 
       if (!id) {
@@ -80,7 +80,7 @@ export const Decorators: React.FC = () => {
       element.addEventListener("click", handle);
     });
 
-    return () => {
+    return (): void => {
       node?.querySelectorAll(".widget").forEach((element) => {
         element.removeEventListener("click", handle);
       });
diff --git a/sandpack-react/src/components/FileTabs/index.tsx b/sandpack-react/src/components/FileTabs/index.tsx
index 10bcf48c0..deaef744a 100644
--- a/sandpack-react/src/components/FileTabs/index.tsx
+++ b/sandpack-react/src/components/FileTabs/index.tsx
@@ -16,7 +16,7 @@ export const FileTabs: React.FC<{ closableTabs?: boolean }> = ({
 
   const { activePath, openPaths, setActiveFile } = sandpack;
 
-  const handleCloseFile = (ev: React.MouseEvent<HTMLDivElement>) => {
+  const handleCloseFile = (ev: React.MouseEvent<HTMLDivElement>): void => {
     ev.stopPropagation();
     const tabElm = (ev.target as HTMLElement).closest(
       "[data-active]"
@@ -41,7 +41,7 @@ export const FileTabs: React.FC<{ closableTabs?: boolean }> = ({
             aria-selected={filePath === activePath}
             className={c("tab-button")}
             data-active={filePath === activePath}
-            onClick={() => setActiveFile(filePath)}
+            onClick={(): void => setActiveFile(filePath)}
             role="tab"
             title={filePath}
             type="button"
diff --git a/sandpack-react/src/components/Navigator/index.tsx b/sandpack-react/src/components/Navigator/index.tsx
index 400a97e8a..b9097fc01 100644
--- a/sandpack-react/src/components/Navigator/index.tsx
+++ b/sandpack-react/src/components/Navigator/index.tsx
@@ -44,11 +44,11 @@ export const Navigator: React.FC<NavigatorProps> = ({
       }
     }, clientId);
 
-    return () => unsub();
+    return (): void => unsub();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>): void => {
     const path = e.target.value.startsWith("/")
       ? e.target.value
       : `/${e.target.value}`;
@@ -56,7 +56,7 @@ export const Navigator: React.FC<NavigatorProps> = ({
     setRelativeUrl(path);
   };
 
-  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>): void => {
     if (e.code === "Enter") {
       //  Enter
       e.preventDefault();
@@ -68,15 +68,15 @@ export const Navigator: React.FC<NavigatorProps> = ({
     }
   };
 
-  const handleRefresh = () => {
+  const handleRefresh = (): void => {
     dispatch({ type: "refresh" });
   };
 
-  const handleBack = () => {
+  const handleBack = (): void => {
     dispatch({ type: "urlback" });
   };
 
-  const handleForward = () => {
+  const handleForward = (): void => {
     dispatch({ type: "urlforward" });
   };
 
diff --git a/sandpack-react/src/components/Preview/index.tsx b/sandpack-react/src/components/Preview/index.tsx
index d39e78eda..3bad9a3d2 100644
--- a/sandpack-react/src/components/Preview/index.tsx
+++ b/sandpack-react/src/components/Preview/index.tsx
@@ -83,14 +83,14 @@ export const SandpackPreview: React.FC<PreviewProps> = ({
       }
     }, clientIdValue);
 
-    return () => {
+    return (): void => {
       unsubscribe();
       unregisterBundler(clientIdValue);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const handleNewURL = (newUrl: string) => {
+  const handleNewURL = (newUrl: string): void => {
     if (!iframeRef.current) {
       return;
     }
diff --git a/sandpack-react/src/components/TranspiledCode/index.tsx b/sandpack-react/src/components/TranspiledCode/index.tsx
index 11ad9d4cd..ce9666123 100644
--- a/sandpack-react/src/components/TranspiledCode/index.tsx
+++ b/sandpack-react/src/components/TranspiledCode/index.tsx
@@ -23,7 +23,7 @@ export const SandpackTranspiledCode: React.FC<CodeViewerProps> = (props) => {
     if (hiddenIframe) {
       sandpack.registerBundler(hiddenIframe, "hidden");
     }
-    return () => {
+    return (): void => {
       sandpack.unregisterBundler("hidden");
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
diff --git a/sandpack-react/src/contexts/sandpackContext.tsx b/sandpack-react/src/contexts/sandpackContext.tsx
index 336dbab3f..a541c6c9b 100644
--- a/sandpack-react/src/contexts/sandpackContext.tsx
+++ b/sandpack-react/src/contexts/sandpackContext.tsx
@@ -577,7 +577,7 @@ class SandpackProvider extends React.PureComponent<
 
         this.queuedListeners[clientId][listenerId] = listener;
 
-        const unsubscribeListener = () => {
+        const unsubscribeListener = (): void => {
           if (this.queuedListeners[clientId][listenerId]) {
             // unsubscribe was called before the client was instantiated
             // common example - a component with autorun=false that unmounted
@@ -603,7 +603,7 @@ class SandpackProvider extends React.PureComponent<
         client.listen(listener)
       );
 
-      const unsubscribeListener = () => {
+      const unsubscribeListener = (): void => {
         const unsubscribeQueuedClients = Object.values(
           this.unsubscribeQueuedListeners
         );
diff --git a/sandpack-react/src/hooks/useActiveCode.stories.tsx b/sandpack-react/src/hooks/useActiveCode.stories.tsx
index 626037c79..8a2eb96ac 100644
--- a/sandpack-react/src/hooks/useActiveCode.stories.tsx
+++ b/sandpack-react/src/hooks/useActiveCode.stories.tsx
@@ -10,10 +10,12 @@ export default {
   title: "hooks/useActiveCode",
 };
 
-const CustomEditor = () => {
+const CustomEditor: React.FC = () => {
   const { code, updateCode } = useActiveCode();
   return (
-    <textarea onChange={(evt) => updateCode(evt.target.value)}>{code}</textarea>
+    <textarea onChange={(evt): void => updateCode(evt.target.value)}>
+      {code}
+    </textarea>
   );
 };
 
diff --git a/sandpack-react/src/hooks/useCodeSandboxLink.ts b/sandpack-react/src/hooks/useCodeSandboxLink.ts
index 71b297f51..3c1a35ab2 100644
--- a/sandpack-react/src/hooks/useCodeSandboxLink.ts
+++ b/sandpack-react/src/hooks/useCodeSandboxLink.ts
@@ -9,7 +9,7 @@ import { useSandpack } from "./useSandpack";
 const getFileParameters = (
   files: SandpackBundlerFiles,
   environment?: SandboxEnvironment
-) => {
+): string => {
   const normalized: Record<string, { content: string; isBinary: boolean }> =
     Object.keys(files).reduce(
       (prev, next) => ({
diff --git a/sandpack-react/src/hooks/useLoadingOverlayState.ts b/sandpack-react/src/hooks/useLoadingOverlayState.ts
index 59c22c829..b73052bcf 100644
--- a/sandpack-react/src/hooks/useLoadingOverlayState.ts
+++ b/sandpack-react/src/hooks/useLoadingOverlayState.ts
@@ -40,7 +40,7 @@ export const useLoadingOverlayState = (
       }
     }, clientId);
 
-    return () => {
+    return (): void => {
       clearTimeout(outerHook);
       clearTimeout(innerHook);
       unsub();
diff --git a/sandpack-react/src/hooks/useSandpackNavigation.stories.tsx b/sandpack-react/src/hooks/useSandpackNavigation.stories.tsx
index 6b41d36ad..266b5c141 100644
--- a/sandpack-react/src/hooks/useSandpackNavigation.stories.tsx
+++ b/sandpack-react/src/hooks/useSandpackNavigation.stories.tsx
@@ -10,7 +10,7 @@ export default {
   title: "hooks/useSandpackNavigation",
 };
 
-const CustomRefreshButton = () => {
+const CustomRefreshButton: React.FC = () => {
   const { refresh } = useSandpackNavigation();
   return (
     <button onClick={refresh} type="button">
diff --git a/sandpack-react/src/hooks/useSandpackNavigation.ts b/sandpack-react/src/hooks/useSandpackNavigation.ts
index 915c59329..6974086a3 100644
--- a/sandpack-react/src/hooks/useSandpackNavigation.ts
+++ b/sandpack-react/src/hooks/useSandpackNavigation.ts
@@ -13,8 +13,8 @@ export const useSandpackNavigation = (
   const { dispatch } = useSandpack();
 
   return {
-    refresh: () => dispatch({ type: "refresh" }, clientId),
-    back: () => dispatch({ type: "urlback" }, clientId),
-    forward: () => dispatch({ type: "urlforward" }, clientId),
+    refresh: (): void => dispatch({ type: "refresh" }, clientId),
+    back: (): void => dispatch({ type: "urlback" }, clientId),
+    forward: (): void => dispatch({ type: "urlforward" }, clientId),
   };
 };
diff --git a/sandpack-react/src/hooks/useTranspiledCode.ts b/sandpack-react/src/hooks/useTranspiledCode.ts
index cd70deb83..8e09dc628 100644
--- a/sandpack-react/src/hooks/useTranspiledCode.ts
+++ b/sandpack-react/src/hooks/useTranspiledCode.ts
@@ -2,7 +2,7 @@ import type { SandpackState } from "../types";
 
 import { useSandpack } from "./useSandpack";
 
-function getTranspiledCode(sandpack: SandpackState) {
+function getTranspiledCode(sandpack: SandpackState): string | null {
   const { activePath, bundlerState } = sandpack;
   if (bundlerState == null) {
     return null;
diff --git a/sandpack-react/src/presets/CustomSandpack.stories.tsx b/sandpack-react/src/presets/CustomSandpack.stories.tsx
index acee19e51..b9d435ef2 100644
--- a/sandpack-react/src/presets/CustomSandpack.stories.tsx
+++ b/sandpack-react/src/presets/CustomSandpack.stories.tsx
@@ -71,29 +71,29 @@ export const UsingVisualElements: React.FC = () => (
   </SandpackProvider>
 );
 
-const CustomOpenInCSB = () => {
+const CustomOpenInCSB: React.FC = () => {
   const url = useCodeSandboxLink();
 
   return <a href={url}>Open in CodeSandbox</a>;
 };
 
-const CustomRefreshButton = () => {
+const CustomRefreshButton: React.FC = () => {
   const { refresh } = useSandpackNavigation();
 
   return (
-    <button onClick={() => refresh()} type="button">
+    <button onClick={(): void => refresh()} type="button">
       Refresh Sandpack
     </button>
   );
 };
 
-const CustomCodeEditor = () => {
+const CustomCodeEditor: React.FC = () => {
   const { code, updateCode } = useActiveCode();
   const { theme } = useSandpackTheme();
 
   return (
     <textarea
-      onChange={(evt) => updateCode(evt.target.value)}
+      onChange={(evt): void => updateCode(evt.target.value)}
       style={{
         width: 400,
         height: 200,
@@ -103,7 +103,7 @@ const CustomCodeEditor = () => {
         background: theme.palette.defaultBackground,
         border: `1px solid ${theme.palette.inactiveText}`,
         color: theme.palette.activeText,
-        lineHeight: theme.typography.lineheight,
+        lineHeight: theme.typography.lineHeight,
       }}
     >
       {code}
@@ -174,7 +174,7 @@ export default function KittenGallery() {
   )
 }`;
 
-const CustomPreview = () => {
+const CustomPreview: React.FC = () => {
   const { sandpack } = useSandpack();
   const iframeRef = useRef<HTMLIFrameElement>();
 
@@ -218,7 +218,7 @@ export const JustIframe = (): React.ReactElement => {
         }}
       >
         <CustomRefreshButton />
-        <button onClick={() => setFirst(!first)} type="button">
+        <button onClick={(): void => setFirst(!first)} type="button">
           Switch
         </button>
         <CustomOpenInCSB />
@@ -242,13 +242,13 @@ export const MultiplePreviews: React.FC = () => {
           ))}
         </SandpackLayout>
       </SandpackProvider>
-      <button onClick={() => setCount(count + 1)}>Add</button>
-      <button onClick={() => setCount(count - 1)}>Remove</button>
+      <button onClick={(): void => setCount(count + 1)}>Add</button>
+      <button onClick={(): void => setCount(count - 1)}>Remove</button>
     </>
   );
 };
 
-function SandpackListener() {
+const SandpackListener: React.FC = () => {
   const { listen } = useSandpack();
 
   useEffect(() => {
@@ -258,7 +258,7 @@ function SandpackListener() {
   }, [listen]);
 
   return null;
-}
+};
 
 export const MultiplePreviewsAndListeners: React.FC = () => {
   const [count, setCount] = useState(2);
@@ -279,14 +279,14 @@ export const MultiplePreviewsAndListeners: React.FC = () => {
           ))}
         </SandpackLayout>
       </SandpackProvider>
-      <button onClick={() => setCount(count + 1)}>Add</button>
-      <button onClick={() => setCount(count - 1)}>Remove</button>
+      <button onClick={(): void => setCount(count + 1)}>Add</button>
+      <button onClick={(): void => setCount(count - 1)}>Remove</button>
 
       <p>Amount of listeners: {listenersCount}</p>
-      <button onClick={() => setListenersCount(listenersCount + 1)}>
+      <button onClick={(): void => setListenersCount(listenersCount + 1)}>
         Add listener
       </button>
-      <button onClick={() => setListenersCount(listenersCount - 1)}>
+      <button onClick={(): void => setListenersCount(listenersCount - 1)}>
         Remove listener
       </button>
     </>
@@ -324,8 +324,8 @@ export const MultiplePreviewsRandomViewports: React.FC = () => {
 
   return (
     <>
-      <button onClick={() => setCount(count + 1)}>Add</button>
-      <button onClick={() => setCount(count > 0 ? count - 1 : 0)}>
+      <button onClick={(): void => setCount(count + 1)}>Add</button>
+      <button onClick={(): void => setCount(count > 0 ? count - 1 : 0)}>
         Remove
       </button>
       <SandpackProvider>
@@ -353,7 +353,7 @@ export const ClosableTabs: React.FC = () => (
   <Sandpack options={{ closableTabs: true }} template="react" />
 );
 
-const ResetButtonComp = () => {
+const ResetButtonComp: React.FC = () => {
   const { sandpack } = useSandpack();
 
   return (
@@ -372,13 +372,13 @@ const ResetButtonComp = () => {
   );
 };
 
-const ResetCurrentFileButton = () => {
+const ResetCurrentFileButton: React.FC = () => {
   const { sandpack } = useSandpack();
 
   return (
     <button
       className="sp-tab-button"
-      onClick={() => sandpack.resetFile(sandpack.activePath)}
+      onClick={(): void => sandpack.resetFile(sandpack.activePath)}
       style={{
         background: "none",
         border: 0,
diff --git a/sandpack-react/src/themes/index.ts b/sandpack-react/src/themes/index.ts
index cd262040e..fa4289e88 100644
--- a/sandpack-react/src/themes/index.ts
+++ b/sandpack-react/src/themes/index.ts
@@ -336,7 +336,7 @@ export const createThemeObject = (
   };
 };
 
-const simpleHashFunction = (str: string) => {
+const simpleHashFunction = (str: string): number => {
   let hash = 0;
   for (let i = 0; i < str.length; hash &= hash) {
     hash = 31 * hash + str.charCodeAt(i++);
diff --git a/website/landing/components/AdvancedUsage/AdvancedUsage.tsx b/website/landing/components/AdvancedUsage/AdvancedUsage.tsx
index 250f2b357..5122c14c1 100644
--- a/website/landing/components/AdvancedUsage/AdvancedUsage.tsx
+++ b/website/landing/components/AdvancedUsage/AdvancedUsage.tsx
@@ -37,14 +37,14 @@ export const AdvancedUsage: React.FC = () => {
     const container = section.current;
     if (!container || !window) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       setSectionTop(container.offsetTop);
       setWindowHeight(window.innerHeight);
     };
 
     onResize();
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [section]);
 
   return (
diff --git a/website/landing/components/Banner/Banner.tsx b/website/landing/components/Banner/Banner.tsx
index 41aac2983..1925c7a39 100644
--- a/website/landing/components/Banner/Banner.tsx
+++ b/website/landing/components/Banner/Banner.tsx
@@ -37,14 +37,14 @@ export const Banner: React.FC = () => {
     const container = section.current;
     if (!container || !window) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       setSectionTop(container.offsetTop);
       setSectionHeight(container.offsetHeight);
     };
 
     onResize();
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [section]);
 
   return (
diff --git a/website/landing/components/Features/Features.tsx b/website/landing/components/Features/Features.tsx
index 8c9f6f3fc..0847bdf59 100644
--- a/website/landing/components/Features/Features.tsx
+++ b/website/landing/components/Features/Features.tsx
@@ -57,14 +57,14 @@ export const Features: React.FC = () => {
     const sectionEl = sectionRef.current;
     if (!sectionEl) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       setSectionTop(sectionEl.offsetTop);
       setSectionHeight(sectionEl.offsetHeight);
     };
 
     onResize();
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [sectionRef]);
 
   const fadeProps = useMemo(
diff --git a/website/landing/components/Hero/HeroDesktop/HeroDesktop.tsx b/website/landing/components/Hero/HeroDesktop/HeroDesktop.tsx
index 741e7a621..d7023c40f 100644
--- a/website/landing/components/Hero/HeroDesktop/HeroDesktop.tsx
+++ b/website/landing/components/Hero/HeroDesktop/HeroDesktop.tsx
@@ -93,7 +93,7 @@ export const HeroDesktop: React.FC = () => {
     const hero = sectionRef.current;
     if (!hero) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       const updatedTop = hero.offsetTop;
       setSectionTop(updatedTop);
 
@@ -104,7 +104,7 @@ export const HeroDesktop: React.FC = () => {
     onResize();
 
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [sectionRef]);
 
   useLayoutEffect(() => {
@@ -135,7 +135,7 @@ export const HeroDesktop: React.FC = () => {
     const editorElement = editorRef.current?.getCodemirror();
     if (!editorElement) return;
 
-    const finishAnimation = () => {
+    const finishAnimation = (): void => {
       window.scrollTo({
         top: sectionTop + scrollHeight * 1.2 + 2,
         behavior: "smooth",
@@ -146,7 +146,7 @@ export const HeroDesktop: React.FC = () => {
 
     element?.addEventListener("focus", finishAnimation);
 
-    return () => {
+    return (): void => {
       element?.removeEventListener("focus", finishAnimation);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
diff --git a/website/landing/components/Intro/Examples.tsx b/website/landing/components/Intro/Examples.tsx
index 523946525..60d4fbb4d 100644
--- a/website/landing/components/Intro/Examples.tsx
+++ b/website/landing/components/Intro/Examples.tsx
@@ -35,7 +35,7 @@ export const Examples: React.FC = () => {
   const [sandpackSectionHeight, setSandpackSectionHeight] = useState(0);
 
   useLayoutEffect(() => {
-    const onResize = () => {
+    const onResize = (): void => {
       if (!sandpackRefSectionTop.current || !sandpackRefSectionHeight.current)
         return;
 
@@ -46,7 +46,7 @@ export const Examples: React.FC = () => {
     onResize();
     window.addEventListener("resize", onResize);
 
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, []);
 
   const scrollRangeX = [
@@ -56,7 +56,7 @@ export const Examples: React.FC = () => {
   ];
 
   // Max width that the left container can grow
-  const breakpoint = () => {
+  const breakpoint = (): string => {
     if (isXLarge) return "600px";
     if (isLarge) return "30vw";
     if (isMedium) return "38vw";
diff --git a/website/landing/components/Intro/SandpackExample.tsx b/website/landing/components/Intro/SandpackExample.tsx
index 5b23be9de..fff406ce6 100644
--- a/website/landing/components/Intro/SandpackExample.tsx
+++ b/website/landing/components/Intro/SandpackExample.tsx
@@ -27,7 +27,7 @@ export const SandpackExampleProvider: React.FC = ({ children }) => {
   return (
     <SandpackExampleContext.Provider
       value={{
-        setOptions: (payload) =>
+        setOptions: (payload): void =>
           setOptions((prev) => ({ ...prev, ...payload })),
         options,
       }}
diff --git a/website/landing/components/Intro/Sections/Custom.tsx b/website/landing/components/Intro/Sections/Custom.tsx
index 258fcf070..b805bf582 100644
--- a/website/landing/components/Intro/Sections/Custom.tsx
+++ b/website/landing/components/Intro/Sections/Custom.tsx
@@ -128,7 +128,7 @@ export const CustomExample: React.FC = () => {
               <SandpackCodeEditor ref={codeEditorRef} showTabs={false} />
 
               <RefreshButton
-                onClick={() => {
+                onClick={(): void => {
                   sandpack.updateCurrentFile(ORIGINAL_CODE);
                 }}
               >
@@ -162,7 +162,7 @@ export const CustomExample: React.FC = () => {
   );
 };
 
-const parseFromSandpackToJson = (code: string) => {
+const parseFromSandpackToJson = (code: string): any => {
   try {
     const customSetup = code.match(/customSetup={{([\s\S]*?)}}/)?.[1];
     if (!customSetup) return;
diff --git a/website/landing/components/Intro/Sections/Editor.tsx b/website/landing/components/Intro/Sections/Editor.tsx
index d68c08d59..c0f8bcee4 100644
--- a/website/landing/components/Intro/Sections/Editor.tsx
+++ b/website/landing/components/Intro/Sections/Editor.tsx
@@ -131,7 +131,7 @@ export const EditorExample: React.FC = () => {
               <SandpackCodeEditor ref={codeEditorRef} showTabs={false} />
 
               <RefreshButton
-                onClick={() => {
+                onClick={(): void => {
                   sandpack.updateCurrentFile(ORIGINAL_CODE);
                   setOptions(ORIGINAL_CUSTOM);
                 }}
diff --git a/website/landing/components/Intro/Sections/Layout.tsx b/website/landing/components/Intro/Sections/Layout.tsx
index b86ac10e8..7553193b1 100644
--- a/website/landing/components/Intro/Sections/Layout.tsx
+++ b/website/landing/components/Intro/Sections/Layout.tsx
@@ -48,7 +48,8 @@ export const LayoutExample: React.FC = () => {
 
   useEffect(() => {
     setVisibility(inView);
-  }, [inView, setVisibility]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [inView]);
 
   return (
     <FadeAnimation>
diff --git a/website/landing/components/Intro/Sections/LayoutContext.tsx b/website/landing/components/Intro/Sections/LayoutContext.tsx
index ec25dfa7c..a54bc7bed 100644
--- a/website/landing/components/Intro/Sections/LayoutContext.tsx
+++ b/website/landing/components/Intro/Sections/LayoutContext.tsx
@@ -49,7 +49,7 @@ export const LayoutExampleProvider: React.FC = ({ children }) => {
     <LayoutContext.Provider
       value={{
         layoutFiles,
-        setLayoutFiles: (filename, code) =>
+        setLayoutFiles: (filename, code): void =>
           setLayoutFiles((prev) => ({ ...prev, [filename]: code })),
         visibility,
         setVisibility,
diff --git a/website/landing/components/Intro/Sections/Template.tsx b/website/landing/components/Intro/Sections/Template.tsx
index 7dc2c8745..77a60837f 100644
--- a/website/landing/components/Intro/Sections/Template.tsx
+++ b/website/landing/components/Intro/Sections/Template.tsx
@@ -62,7 +62,7 @@ export const TemplateExample: React.FC = () => {
     }
   }, [higherMobile, inView]);
 
-  const shuffleTemplate = () => {
+  const shuffleTemplate = (): void => {
     const currentIndex = frameworkOptions.indexOf(template);
 
     setTemplate(frameworkOptions[(currentIndex + 1) % frameworkOptions.length]);
@@ -90,9 +90,9 @@ export const TemplateExample: React.FC = () => {
           <SnippetButton
             ref={boxRef}
             onClick={shuffleTemplate}
-            onMouseEnter={() => setToolTipVisibility(true)}
-            onMouseLeave={() => setToolTipVisibility(false)}
-            onMouseMove={(event) =>
+            onMouseEnter={(): void => setToolTipVisibility(true)}
+            onMouseLeave={(): void => setToolTipVisibility(false)}
+            onMouseMove={(event): void =>
               setMousePosition(getRelativeCoordinates(event, boxRef.current))
             }
           >
diff --git a/website/landing/components/Intro/Sections/Theme.tsx b/website/landing/components/Intro/Sections/Theme.tsx
index 37af5027b..e9df75ecf 100644
--- a/website/landing/components/Intro/Sections/Theme.tsx
+++ b/website/landing/components/Intro/Sections/Theme.tsx
@@ -64,7 +64,7 @@ export const ThemeExample: React.FC = () => {
     }
   }, [higherMobile, inView]);
 
-  const shuffleTheme = () => {
+  const shuffleTheme = (): void => {
     const currentIndex = themeOptions.indexOf(theme);
 
     setTheme(themeOptions[(currentIndex + 1) % themeOptions.length]);
@@ -93,9 +93,9 @@ export const ThemeExample: React.FC = () => {
           <SnippetButton
             ref={boxRef}
             onClick={shuffleTheme}
-            onMouseEnter={() => setToolTipVisibility(true)}
-            onMouseLeave={() => setToolTipVisibility(false)}
-            onMouseMove={(event) =>
+            onMouseEnter={(): void => setToolTipVisibility(true)}
+            onMouseLeave={(): void => setToolTipVisibility(false)}
+            onMouseMove={(event): void =>
               setMousePosition(getRelativeCoordinates(event, boxRef.current))
             }
           >
diff --git a/website/landing/components/Intro/Sections/common.tsx b/website/landing/components/Intro/Sections/common.tsx
index 552a33aa3..19da2b1eb 100644
--- a/website/landing/components/Intro/Sections/common.tsx
+++ b/website/landing/components/Intro/Sections/common.tsx
@@ -91,7 +91,10 @@ export const SandpackContainerMobile = styled("div", {
   },
 });
 
-export const getRelativeCoordinates = (event: any, referenceElement: any) => {
+export const getRelativeCoordinates = (
+  event: any,
+  referenceElement: any
+): Record<"x" | "y", number> => {
   const position = {
     x: event.pageX,
     y: event.pageY,
@@ -178,14 +181,14 @@ export const FadeAnimation: React.FC = ({ children }) => {
     const sectionEl = sectionRef.current;
     if (!sectionEl) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       setSectionTop(sectionEl.offsetTop);
       setSectionHeight(sectionEl.offsetHeight);
     };
 
     onResize();
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [sectionRef]);
 
   const { scrollY } = useViewportScroll();
@@ -213,7 +216,7 @@ export const FadeAnimation: React.FC = ({ children }) => {
   );
 };
 
-FadeAnimation.toString = () => `.fade-animation`;
+FadeAnimation.toString = (): string => `.fade-animation`;
 
 export const CodeWrapper = styled("div", {
   position: "relative",
diff --git a/website/landing/components/Showcase/Showcase.tsx b/website/landing/components/Showcase/Showcase.tsx
index 74236dc43..29d83fdc5 100644
--- a/website/landing/components/Showcase/Showcase.tsx
+++ b/website/landing/components/Showcase/Showcase.tsx
@@ -67,14 +67,14 @@ export const Showcase: React.FC = () => {
     const container = sectionRef.current;
     if (!container || !window) return;
 
-    const onResize = () => {
+    const onResize = (): void => {
       setSectionTop(container.offsetTop);
       setSectionScroll(container.offsetHeight - window.innerHeight);
     };
 
     onResize();
     window.addEventListener("resize", onResize);
-    return () => window.removeEventListener("resize", onResize);
+    return (): void => window.removeEventListener("resize", onResize);
   }, [sectionRef]);
 
   return (
diff --git a/website/landing/components/common/Clipboard.tsx b/website/landing/components/common/Clipboard.tsx
index 5eabd1e1a..d5389f8c5 100644
--- a/website/landing/components/common/Clipboard.tsx
+++ b/website/landing/components/common/Clipboard.tsx
@@ -54,7 +54,7 @@ export const Clipboard: React.FC = () => {
       setToastVisible(false);
     }, 2000);
 
-    return () => clearTimeout(timeout);
+    return (): void => clearTimeout(timeout);
   }, [toastVisible]);
 
   return (
diff --git a/website/landing/components/common/useBreakpoint.ts b/website/landing/components/common/useBreakpoint.ts
index 2662422b4..7f1cc0d48 100644
--- a/website/landing/components/common/useBreakpoint.ts
+++ b/website/landing/components/common/useBreakpoint.ts
@@ -20,7 +20,8 @@ export const useBreakpoint = (
     checkBreakpoint();
 
     window.addEventListener("resize", checkBreakpoint);
-    return () => {
+
+    return (): void => {
       window.removeEventListener("resize", checkBreakpoint);
     };
   }, [checkBreakpoint]);