{"version":3,"sources":["assets/images/logo.png","assets/images/chan-avatar.svg","assets/images/second-fold.svg","assets/images/designer.svg","assets/images/code.svg","assets/images/mentor.svg","assets/images/projects/excel_logo.png","assets/images/projects/esl.svg","assets/images/projects/laurus.png","assets/images/projects/videoscribe.png","assets/images/projects/sparkol.png","assets/images/projects/powerplate.png","assets/images/programming/frameworks.png","components/Nav.js","components/AboutMe.js","components/Projects.js","components/Skills.js","components/Footer.js","App.js","serviceWorker.js","index.js"],"names":["module","exports","Nav","props","state","isOpen","contactMeString","this","fillRule","d","className","href","rel","src","logo","width","height","alt","onClick","setState","type","viewBox","renderMenuButton","React","Component","AboutMe","chanAvatar","secondFold","designer","code","mentor","Projects","target","excel","esl","laurus","videoscribe","sparkol","powerplate","Skills","frameworks","Footer","App","Helmet","charSet","Boolean","window","location","hostname","match","TagManager","initialize","gtmId","ReactDOM","render","StrictMode","document","getElementById","navigator","serviceWorker","ready","then","registration","unregister","catch","error","console","message"],"mappings":"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","file":"static/js/main.fcaf3801.chunk.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/media/logo.f67a799c.png\";","module.exports = __webpack_public_path__ + \"static/media/chan-avatar.5fd88976.svg\";","module.exports = __webpack_public_path__ + \"static/media/second-fold.ae74261d.svg\";","module.exports = __webpack_public_path__ + \"static/media/designer.54adb9ad.svg\";","module.exports = __webpack_public_path__ + \"static/media/code.00c47a20.svg\";","module.exports = __webpack_public_path__ + \"static/media/mentor.8d1e0b66.svg\";","module.exports = __webpack_public_path__ + \"static/media/excel_logo.171c8d76.png\";","module.exports = __webpack_public_path__ + \"static/media/esl.29854541.svg\";","module.exports = \"data:image/png;base64,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\"","module.exports = \"data:image/png;base64,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\"","module.exports = __webpack_public_path__ + \"static/media/sparkol.38839c96.png\";","module.exports = __webpack_public_path__ + \"static/media/powerplate.af670315.png\";","module.exports = __webpack_public_path__ + \"static/media/frameworks.60824c35.png\";","\nimport logo from '../assets/images/logo.png';\nimport React  from 'react';\n\n\nclass Nav extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      isOpen : false,\n      contactMeString : \"Say Hello!\"\n    }\n  }\n\n  componentDidMount() {\n  }\n\n  componentWillUnmount() {\n  }\n  renderMenuButton(){\n    if(this.state.isOpen){\n      return(\n        <path fillRule=\"evenodd\" d=\"M18.278 16.864a1 1 0 0 1-1.414 1.414l-4.829-4.828-4.828 4.828a1 1 0 0 1-1.414-1.414l4.828-4.829-4.828-4.828a1 1 0 0 1 1.414-1.414l4.829 4.828 4.828-4.828a1 1 0 1 1 1.414 1.414l-4.828 4.829 4.828 4.828z\"/>\n      )\n    }else{\n      return (\n        <path fillRule=\"evenodd\" d=\"M4 5h16a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2z\"/>\n      )\n    }\n  }\n  renderMenuItems(){\n    if(this.state.isOpen){\n      return(\n        <nav className=\"px-2 pt-2 pb-4 sm:flex sm:p-0 \"  >\n        <button className=\"flex items-center px-3 py-2 bg-purple hover:bg-purple-700 text-purple-700 font-semibold hover:text-white py-2 px-4 border border-purple-500 hover:border-transparent rounded-full\">\n        <a href = \"mailto: chrvillaruel@gmail.com\"  rel=\"noopener noreferrer\"> {this.state.contactMeString}</a>\n        </button>\n      </nav>\n      )\n    }\n  }\n  render() {\n    return (\n      <header className=\" sm:flex sm:justify-between sm:items-center sm:px-4 sm:py-3\">\n            <div className=\"flex items-center justify-between px-4 py-3 sm:p-0\">\n              <div>\n                <img\n                  src={logo}\n                  width=\"50\"\n                  height=\"50\"\n                  className=\"align-top d-inline-block\"\n                  alt=\"React Bootstrap logo\"\n                />\n              </div>\n              <div className=\"sm:hidden\">\n                <button  onClick={() => this.setState({isOpen: !this.state.isOpen})}  type=\"button\" className=\"block text-gray-500 hover:text-white focus:text-white focus:outline-none\">\n                  <svg className=\"h-6 w-6 fill-current text-purple-900\" viewBox=\"0 0 24 24\">\n                    {this.renderMenuButton()}\n                  </svg>\n                </button>\n              </div>\n            </div>\n            <nav className={`${this.state.isOpen ? 'block' : 'hidden' } px-2 pt-2 pb-4 sm:flex sm:p-0`}  >\n            <button className=\"flex items-center mx-auto px-3 py-2 bg-purple hover:bg-purple-900 text-purple-900 font-semibold hover:text-white py-2 px-4 border border-purple-500 hover:border-transparent rounded-full\">\n            <a href = \"mailto: chrvillaruel@gmail.com\"> {this.state.contactMeString}</a>\n            </button>\n          </nav>\n          </header>\n    );\n  }\n}\nexport default Nav;\n","import chanAvatar from '../assets/images/chan-avatar.svg';\nimport secondFold from '../assets/images/second-fold.svg';\nimport designer from '../assets/images/designer.svg';\nimport code from '../assets/images/code.svg';\nimport mentor from '../assets/images/mentor.svg';\nimport React  from 'react';\n\n\nclass AboutMe extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n    }\n  }\n\n  render() {\n    return (\n        <div>\n            <div className=\"flex mb-4  py-50 \">\n                <div className=\"w-full  \">\n                <div className=\"mt-5 text-center\">\n                <h1 className=\"text-2xl font-semibold md:text-3xl\">Fullstack Software Engineer</h1>\n                    <p className=\"px-5 mt-3 mt-5 text-sm\">I design and code beautifully simple things, and I love what I do.</p>\n                    <div className=\"mt-5\">\n                    <img\n                        src={chanAvatar}\n                        width=\"250\"\n                        height=\"250\"\n                        className=\"w-auto mx-auto my-24 d-inline-block\"\n                        alt=\"React Bootstrap logo\"\n                    />\n                    <br />\n                    <img\n                        src={secondFold}\n                        width=\"400\"\n                        height=\"250\"\n                        className=\"w-auto mx-auto d-inline-block\"\n                        alt=\"React Bootstrap logo\"\n                    />\n                    </div>\n                </div>\n                </div>\n            </div>\n\n            <div className=\"flex mb-4 bg-purple-900 \">\n                <div className=\"w-full  py-10 px-10  md:px-48 md:py-48 lg:px-48 lg:py-48  text-white text-center\">\n                <h1 className=\"font-semibold sm:p-5 md:p-0 font-size-12 lg:font-size-20 md:text-3xl \">Hello, I’m Christian. Nice to meet you.</h1>\n                    <p  className=\"w-full sm:text-sm md:text-lg\">Since beginning my journey as a software engineer, I've done remote work for agencies, corporate and collaborated with talented people to create digital products for both business and consumer use. I've done many projects using different programming languages for five years, and I delivered them successfully. I'm very optimistic that I can help you.\n                    </p>\n                </div>\n            </div>\n            <div className=\"flex flex-wrap  \">\n          <div className=\"flex  flex-col sm:w-1/2 px-5 py-5   md:w-1/3  lg:px-0 lg:py-0  xl:px-0 xl:py-0  \">\n              <div className=\" text-center border-solid\">\n                <div className=\" rounded overflow-hidden shadow-lg py-5\">\n                      <img\n                        src={designer}\n                        width=\"50\"\n                        height=\"50\"\n                        className=\"mx-auto d-inline-block \"\n                        alt=\"React Bootstrap logo\"\n                      />\n                    <div className=\"px-6 py-4\">\n                      <div className=\"font-bold text-xl mb-2\">Designer</div>\n                      <p className=\"text-gray-700 text-base\">\n                      I value simple and clean design patterns, and thoughtful interactions.\n                      </p>\n                    </div>\n                    <div className=\"px-6 py-4\">\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#UI & UX</span>\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#CSS</span>\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#Responsivess</span>\n                    </div>\n                  </div>\n                </div>\n          </div>\n          <div className=\" flex  flex-col px-5 py-5 sm:w-1/2 md:w-1/3  lg:px-0 lg:py-0   xl:px-0 xl:py-0 \">\n            <div className=\" text-center border-solid\">\n                    <div className=\" rounded overflow-hidden shadow-lg py-5\">\n                          <img\n                            src={code}\n                            width=\"50\"\n                            height=\"50\"\n                            className=\"mx-auto d-inline-block \"\n                            alt=\"React Bootstrap logo\"\n                          />\n                        <div className=\"px-6 py-4\">\n                          <div className=\"font-bold text-xl mb-2\">Developer</div>\n                          <p className=\"text-gray-700 text-base\">\n                          I like to code things from scratch, and enjoy bringing ideas to life in the browser.\n                          </p>\n                        </div>\n                        <div className=\"px-6 py-4\">\n                          <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#API</span>\n                          <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#Backend</span>\n                          <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#Fronted</span>\n                        </div>\n                      </div>\n              </div>\n          </div>\n          <div className=\"flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3   lg:px-0 lg:py-0   xl:px-0 xl:py-0 \">\n            <div className=\"text-center border-solid\">\n                <div className=\"rounded overflow-hidden shadow-lg py-5\">\n                      <img\n                        src={mentor}\n                        width=\"50\"\n                        className=\"mx-auto d-inline-block \"\n                        alt=\"React Bootstrap logo\"\n                      />\n                    <div className=\"px-6 py-4\">\n                      <div className=\"font-bold text-xl mb-2\">Mentor</div>\n                      <p className=\"text-gray-700 text-base\">\n                      I genuinely care about people, and love helping fellow developers on their craft.\n                      </p>\n                    </div>\n                    <div className=\"px-6 py-4\">\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#help</span>\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2\">#learn</span>\n                      <span className=\"inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700\">#build</span>\n                    </div>\n                  </div>\n                </div>\n            </div>\n        </div>\n        </div>\n    );\n  }\n}\nexport default AboutMe;\n","\nimport React  from 'react';\nimport excel from '../assets/images/projects/excel_logo.png';\nimport esl from '../assets/images/projects/esl.svg';\nimport laurus from '../assets/images/projects/laurus.png';\nimport videoscribe from '../assets/images/projects/videoscribe.png';\nimport sparkol from '../assets/images/projects/sparkol.png';\nimport powerplate from '../assets/images/projects/powerplate.png';\n\nclass Projects extends React.Component {\n\n  render() {\n    return (\n    <div className=\"flex-wrap px-6 py-6 mx-auto text-center\">\n        <h1 className=\"font-semibold text-3xl pt-10\">My Recent Work</h1>\n        <p className=\"pb-10\">Here are a few projects I've worked on recently. Want to see more? <a href = \"mailto: chrvillaruel@gmail.com\"   rel=\"noopener noreferrer\" className=\"text-purple-900\">Email me.</a> </p>\n        <div className=\"flex flex-wrap  \">\n          <div className=\"  flex  flex-col sm:w-1/2 px-5 py-5   md:w-1/3  h-auto\">\n            <a target=\"_blank\" href=\"http://exceldrivingschool.com/\"  rel=\"noopener noreferrer\">\n                <div className=\" text-center border-solid\">\n                  <div className=\"bg-indigo-700 rounded overflow-hidden shadow-lg py-5\">\n                        <img\n                          src={excel}\n                          height=\"50\"\n                          width=\"200\"\n                          className=\"mx-auto d-inline-block \"\n                          alt=\"React Bootstrap logo\"\n                        />\n                      <div className=\"px-6 py-4 text-white\">\n                          <div className=\"font-bold text-xl mb-2\">EXCEL DRVIVING SCHOOL </div>\n                          <p className=\"text-white text-base\">\n                          A driving school site in Chicago that allows the students to schedule sessions online.\n                          </p>\n                      </div>\n                    </div>\n                  </div>\n              </a>\n          </div>\n          <div className=\" flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3  h-auto\">\n          <a target=\"_blank\" href=\"https://esllist.com/\"  rel=\"noopener noreferrer\">\n            <div className=\"text-white text-center border-solid\">\n                    <div className=\"bg-blue-600 rounded overflow-hidden shadow-lg py-5\">\n                          <img\n                            src={esl}\n                            className=\"mx-auto d-inline-block \"\n                            alt=\"React Bootstrap logo\"\n                          />\n                        <div className=\"px-6 py-4\">\n                          <div className=\"font-bold text-xl mb-2\">ESLList</div>\n                          <p className=\"text-white text-base\">\n                          A job listing and subscription site for mostly an English tutor in South Korea.\n                          </p>\n                        </div>\n\n                      </div>\n              </div>\n              </a>\n          </div>\n          <div className=\"flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3 h-auto \">\n          <a target=\"_blank\" href=\"https://laurus.ph/\"  rel=\"noopener noreferrer\">\n            <div className=\"text-center border-solid\">\n                <div className=\"bg-red-500  rounded  shadow-lg py-5\">\n                      <img\n                        src={laurus}\n                        width=\"100\"\n                        height=\"100\"\n                        className=\"mx-auto d-inline-block \"\n                        alt=\"React Bootstrap logo\"\n                      />\n                    <div className=\"px-6 py-4\">\n                      <div className=\" text-white font-bold text-xl mb-2\">Laurus</div>\n                      <p className=\"text-white text-base\">\n                      It is an online booking system for events for self improvement learn from best speakers.\n                      </p>\n                    </div>\n\n                  </div>\n                </div>\n\n\n              </a>\n            </div>\n\n            <div className=\"flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3 h-auto   \">\n\n            <a target=\"_blank\" href=\"https://www.videoscribe.co/\"  rel=\"noopener noreferrer\">\n              <div className=\"text-center border-solid\">\n                  <div className=\"bg-blue-400  rounded  shadow-lg py-5\">\n                        <img\n                          src={videoscribe}\n                          width=\"200\"\n                          height=\"200\"\n                          className=\"py-3 mx-auto d-inline-block \"\n                          alt=\"React Bootstrap logo\"\n                        />\n                      <div className=\"px-6 py-4\">\n                        <div className=\" text-white font-bold text-xl mb-2\">Videoscribe</div>\n                        <p className=\"text-white text-base\">\n                        Whiteboard style animated video, or scribe videos, then check out VideoScribe.\n                        </p>\n                      </div>\n\n                    </div>\n                  </div>\n              </a>\n            </div>\n\n\n            <div className=\"flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3  h-auto   \">\n            <a target=\"_blank\" href=\"https://www.sparkol.com/en/\"  rel=\"noopener noreferrer\">\n            <div className=\"text-center border-solid\">\n                <div className=\"bg-red-400  rounded  shadow-lg py-5\">\n                      <img\n                        src={sparkol}\n                        width=\"200\"\n                        height=\"200\"\n                        className=\"py-4 mx-auto d-inline-block \"\n                        alt=\"React Bootstrap logo\"\n                      />\n                    <div className=\"px-6 py-4\">\n                      <div className=\" text-white font-bold text-xl mb-2\">Sparkol</div>\n                      <p className=\"text-white text-base\">\n                      Sparkol is the creator of the #1 whiteboard animation software like VideoScribe\n                      </p>\n                    </div>\n\n                  </div>\n                </div>\n              </a>\n            </div>\n\n\n            <div className=\"flex flex-col px-5 py-5 sm:w-1/2 md:w-1/3  xl:h-48   \">\n\n            <a target=\"_blank\" href=\"https://powerplate.com/\"  rel=\"noopener noreferrer\">\n\n            <div className=\"text-center border-solid\">\n                <div className=\"bg-red-400  rounded  shadow-lg py-5\">\n                      <img\n                        src={powerplate}\n                        width=\"200\"\n                        height=\"200\"\n                        className=\"mx-auto d-inline-block \"\n                        alt=\"React Bootstrap logo\"\n                      />\n                    <div className=\"px-6 py-4\">\n                      <div className=\" text-white font-bold text-xl mb-2\">Powerplate</div>\n                      <p className=\"text-white text-base\">\n                      A big ecommerce site based in UK and US. They are selling gym equipment worldwide.\n                      </p>\n                    </div>\n\n                  </div>\n                </div>\n              </a>\n            </div>\n        </div>\n      </div>)\n  }\n}\n\n\nexport default Projects;\n","import React from 'react';\nimport frameworks from '../assets/images/programming/frameworks.png';\n\nclass Skills extends React.Component {\n\n  render () {\n    return (\n      <div>\n        <div className=\"flex-wrap px-6 py-6 mx-auto text-center\">\n            <h1 className=\"font-semibold text-3xl pt-10\">Skills</h1>\n            <p className=\"md:pb-10 sm:pb-0\">Here are a few frameworks I've worked on</p>\n        </div>\n\n        <div className=\"flex mb-10 bg-white\">\n            <div className=\"w-full\">\n                <img\n                  src={frameworks}\n                  className=\"mx-auto\"\n                  width=\"850\"\n                  alt=\"Framworks\"\n                />\n            </div>\n        </div>\n      </div>\n    )\n  }\n\n}\n\nexport default Skills;\n","import React from 'react'\n\nclass Footer extends React.Component {\n\n  render() {\n    return (\n      <div className=\"flex-wrap px-6 py-6 mx-auto text-center px-10 md:px-0 sm:px-0 xs:px-5 bg-gray-900 mt-3\">\n        <p className=\"text-white sm:pb-0\">© 2022 Christian Villaruel</p>\n      </div>\n    )\n  }\n}\n\nexport default Footer\n","import React from 'react';\nimport {Helmet} from \"react-helmet\";\nimport Nav from './components/Nav';\nimport AboutMe from './components/AboutMe';\nimport Projects from './components/Projects';\n\n\nimport './assets/styles/main.css';\nimport Skills from './components/Skills';\nimport Footer from './components/Footer';\n\n\nfunction App() {\n\n\n  return (\n    <div className=\"antialiased App \" >\n       <Helmet>\n          <meta charSet=\"utf-8\" />\n          <title>Christian Viilaruel | Software Engineer</title>\n        </Helmet>\n        <Nav />\n        <AboutMe />\n        <Projects />\n        <Skills />\n        <Footer />\n    </div>\n  );\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n  window.location.hostname === 'localhost' ||\n    // [::1] is the IPv6 localhost address.\n    window.location.hostname === '[::1]' ||\n    // 127.0.0.0/8 are considered localhost for IPv4.\n    window.location.hostname.match(\n      /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n    )\n);\n\nexport function register(config) {\n  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n    // The URL constructor is available in all browsers that support SW.\n    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n    if (publicUrl.origin !== window.location.origin) {\n      // Our service worker won't work if PUBLIC_URL is on a different origin\n      // from what our page is served on. This might happen if a CDN is used to\n      // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n      return;\n    }\n\n    window.addEventListener('load', () => {\n      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n      if (isLocalhost) {\n        // This is running on localhost. Let's check if a service worker still exists or not.\n        checkValidServiceWorker(swUrl, config);\n\n        // Add some additional logging to localhost, pointing developers to the\n        // service worker/PWA documentation.\n        navigator.serviceWorker.ready.then(() => {\n          console.log(\n            'This web app is being served cache-first by a service ' +\n              'worker. To learn more, visit https://bit.ly/CRA-PWA'\n          );\n        });\n      } else {\n        // Is not localhost. Just register service worker\n        registerValidSW(swUrl, config);\n      }\n    });\n  }\n}\n\nfunction registerValidSW(swUrl, config) {\n  navigator.serviceWorker\n    .register(swUrl)\n    .then(registration => {\n      registration.onupdatefound = () => {\n        const installingWorker = registration.installing;\n        if (installingWorker == null) {\n          return;\n        }\n        installingWorker.onstatechange = () => {\n          if (installingWorker.state === 'installed') {\n            if (navigator.serviceWorker.controller) {\n              // At this point, the updated precached content has been fetched,\n              // but the previous service worker will still serve the older\n              // content until all client tabs are closed.\n              console.log(\n                'New content is available and will be used when all ' +\n                  'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n              );\n\n              // Execute callback\n              if (config && config.onUpdate) {\n                config.onUpdate(registration);\n              }\n            } else {\n              // At this point, everything has been precached.\n              // It's the perfect time to display a\n              // \"Content is cached for offline use.\" message.\n              console.log('Content is cached for offline use.');\n\n              // Execute callback\n              if (config && config.onSuccess) {\n                config.onSuccess(registration);\n              }\n            }\n          }\n        };\n      };\n    })\n    .catch(error => {\n      console.error('Error during service worker registration:', error);\n    });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n  // Check if the service worker can be found. If it can't reload the page.\n  fetch(swUrl, {\n    headers: { 'Service-Worker': 'script' },\n  })\n    .then(response => {\n      // Ensure service worker exists, and that we really are getting a JS file.\n      const contentType = response.headers.get('content-type');\n      if (\n        response.status === 404 ||\n        (contentType != null && contentType.indexOf('javascript') === -1)\n      ) {\n        // No service worker found. Probably a different app. Reload the page.\n        navigator.serviceWorker.ready.then(registration => {\n          registration.unregister().then(() => {\n            window.location.reload();\n          });\n        });\n      } else {\n        // Service worker found. Proceed as normal.\n        registerValidSW(swUrl, config);\n      }\n    })\n    .catch(() => {\n      console.log(\n        'No internet connection found. App is running in offline mode.'\n      );\n    });\n}\n\nexport function unregister() {\n  if ('serviceWorker' in navigator) {\n    navigator.serviceWorker.ready\n      .then(registration => {\n        registration.unregister();\n      })\n      .catch(error => {\n        console.error(error.message);\n      });\n  }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nimport TagManager from 'react-gtm-module'\n\nconst tagManagerArgs = {\n    gtmId: 'G-H0YRLPFKKV'\n}\n\nTagManager.initialize(tagManagerArgs)\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""}