import PropTypes from 'prop-types'; import Head from 'next/head'; import { ThemeProvider } from '@mui/material/styles'; import CssBaseline from '@mui/material/CssBaseline'; import { CacheProvider } from '@emotion/react'; import theme from '../src/theme'; import createEmotionCache from '../src/createEmotionCache'; import Layout from '../components/Layout' import * as React from 'react'; import ResponsiveAppBar from '../components/Nav' import {BrowserRouter} from 'react-router-dom'; const DynamicComponentWithNoSSR = <>Some JSX // Client-side cache, shared for the whole session of the user in the browser. const clientSideEmotionCache = createEmotionCache(); export default function MyApp(props) { const { Component, emotionCache = clientSideEmotionCache, pageProps } = props; if (typeof window !== 'undefined') { console.log('You are on the browser') } else { console.log('You are on the server') } return ( <> {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */} ); } MyApp.propTypes = { Component: PropTypes.elementType.isRequired, emotionCache: PropTypes.object, pageProps: PropTypes.object.isRequired, };