\n
\n )}\n {`Header inside viewport ${inView}.`}
\nPlain children are always rendered. Use onChange to monitor state.
\n\n *
\n * );\n * };\n * ```\n */\nexport function useInView({\n threshold,\n delay,\n trackVisibility,\n rootMargin,\n root,\n triggerOnce,\n skip,\n initialInView,\n fallbackInView,\n}: IntersectionOptions = {}): InViewHookResponse {\n const unobserve = React.useRef{`Header inside viewport ${inView}.`}
\n *\r\n
\r\n \r\n \r\n
\r\n - \r\n {['Home', 'Work', 'Project'].map((item) => (\r\n
- \r\n \r\n
\r\n Get in touch\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\n\r\nconst BannerRowBottom = ({ title }) => {\r\n return (\r\n \r\n \r\n \r\n I am a passionate problem solver with a natural curiosity for knowledge.\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n scroll
down\r\n \r\n
\r\n );\r\n};\r\n/* \r\nconst BannerRowCenter = ({ title, playMarquee }) => {\r\n return (\r\n down\r\n
\r\n
\r\n );\r\n}; */\r\n\r\nexport default Banner;\r\n","import React from \"react\";\r\n\r\nconst Image = ({ src, fallback, type = \"image/webp\", alt }) => {\r\n return (\r\n \r\n
\r\n \r\n What I have built\r\n
\r\nProjects
\r\n\r\n {projects.map((project, index) => (\r\n \r\n 
\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Project;\r\n","import React from 'react'\nimport { VerticalTimeline, VerticalTimelineElement } from 'react-vertical-timeline-component'\nimport { motion } from 'framer-motion'\n\nimport 'react-vertical-timeline-component/style.min.css'\n\nconst experiences = [\n {\n title: \"Cyber Application Security Intern\",\n company_name: \"Deloitte (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company4.png`,\n iconBg: \"#383E56\",\n date: \"May 2023 - Jul 2023\",\n points: [\n \"Drafted and tailored engagement proposal letters, demonstrating effective communication and presentation of comprehensive project scopes to a client.\",\n \"Prepared over 100 User to Role Matrices using client inputs, ensuring precise mapping of user access and authorizations in complex SAP environments and link several organization matrix data into Tableau for visualization.\",\n \"Automated the extraction and integration of SAP data into Power BI, improving reporting efficiency and insights.\",\n \"Utilized Jira for issue tracking and project management, ensuring efficient coordination and streamlined workflows across teams.\",\n \n ],\n },\n {\n title: \"IT Operations Engineer\",\n company_name: \"Kyndryl (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company3.png`,\n iconBg: \"#E6DEDD\",\n date: \"May 2022 - Aug 2022\",\n points: [\n \"Specialized in providing technical support and maintenance. Deployed, cloned hardware change operations for healthcare technology solutions for thousands of devices.\",\n \"Utilized CRON to automate routine tasks, enhancing operational efficiency in managing healthcare technology solutions. Which includes scheduling regular maintenance activities and system checks.\",\n \"Applied an in-depth understanding of TCP/IP networking fundamentals and expertise in internet service architectures (load balancing, CDNs), enhancing the efficiency and resilience of healthcare technology solutions.\",\n ],\n },\n {\n title: \"IT Assistant\",\n company_name: \"Central Provident Fund Board (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company2.png`,\n iconBg: \"#383E56\",\n date: \"Jun 2019 - Aug 2019\",\n points: [\n \"Collaborated cross-functionally to curate and integrate hundreds of new variables into the organization's data dictionary, strategically paved way for future policy implementations.\",\n \"Cultivated professional relationships with 10+ clients, adeptly discussed the nature of variables and guiding optimal utilization within the data compliance context.\",\n \"Displayed utmost discretion and responsibility in the secure handling and safeguarding of classified information, adhering to the highest standards of confidentiality.\",\n ],\n },\n {\n title: \"Software Engineer\",\n company_name: \"Ngee Ann Polytechnic (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company1.png`,\n iconBg: \"#E6DEDD\",\n date: \"Mar 2019 - May 2019\",\n points: [\n \"Team lead for the development of an autonomous concierge cum security robot in collaboration with Tan Tock Seng Hospital for my final year project.\",\n \"The robot, activated by voice command, navigates predefined points, enhancing security and directional guidance within the hospital\",\n \"Contributed to creating new messages in packages, utilizing CMakeList.txt. Project achievements include improved hospital security, streamlined visitor guidance for 1000+ weekly visitors, and potential applications in various settings.\",\n ],\n },\n];\n\nconst textVariant = (delay) => {\n return {\n hidden: {\n y: -50,\n opacity: 0,\n },\n show: {\n y: 0,\n opacity: 1,\n transition: {\n type: \"spring\",\n duration: 1.25,\n delay: delay,\n },\n },\n };\n};\n\nconst WorkCard = ({ experience }) => (\n \r\n \r\n {project.title}\r\n
\r\n\r\n {project.description}\r\n
\r\n \r\n ))}\r\n
\n \n }>\n \n
\n\n \n {experience.title}\n
\n\n {experience.company_name}\n
\n- \n {experience.points.map((point,index) => (\n
- \n {point}\n \n ))}\n
\n What I have done so far\n
\nWork experiences
\n\n \n {experiences.map((experience, index) =>\n \n )}\n \n
\n \n )\n}\n\nexport default Work;","export const store = {\n _origin: 'https://api.emailjs.com',\n};\n","export const validateParams = (publicKey, serviceID, templateID) => {\n if (!publicKey) {\n throw 'The public key is required. Visit https://dashboard.emailjs.com/admin/account';\n }\n if (!serviceID) {\n throw 'The service ID is required. Visit https://dashboard.emailjs.com/admin';\n }\n if (!templateID) {\n throw 'The template ID is required. Visit https://dashboard.emailjs.com/admin/templates';\n }\n return true;\n};\n","export class EmailJSResponseStatus {\n constructor(httpResponse) {\n this.status = httpResponse ? httpResponse.status : 0;\n this.text = httpResponse ? httpResponse.responseText : 'Network Error';\n }\n}\n","import { EmailJSResponseStatus } from '../models/EmailJSResponseStatus';\nimport { store } from '../store/store';\nexport const sendPost = (url, data, headers = {}) => {\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest();\n xhr.addEventListener('load', ({ target }) => {\n const responseStatus = new EmailJSResponseStatus(target);\n if (responseStatus.status === 200 || responseStatus.text === 'OK') {\n resolve(responseStatus);\n }\n else {\n reject(responseStatus);\n }\n });\n xhr.addEventListener('error', ({ target }) => {\n reject(new EmailJSResponseStatus(target));\n });\n xhr.open('POST', store._origin + url, true);\n Object.keys(headers).forEach((key) => {\n xhr.setRequestHeader(key, headers[key]);\n });\n xhr.send(data);\n });\n};\n","import { init } from './methods/init/init';\nimport { send } from './methods/send/send';\nimport { sendForm } from './methods/sendForm/sendForm';\nexport { init, send, sendForm };\nexport default {\n init,\n send,\n sendForm,\n};\n","import { store } from '../../store/store';\nimport { validateParams } from '../../utils/validateParams';\nimport { sendPost } from '../../api/sendPost';\n/**\n * Send a template to the specific EmailJS service\n * @param {string} serviceID - the EmailJS service ID\n * @param {string} templateID - the EmailJS template ID\n * @param {object} templatePrams - the template params, what will be set to the EmailJS template\n * @param {string} publicKey - the EmailJS public key\n * @returns {Promise\n
\n \n
\n Get in touch
\nContact.
\n \n\r\n
\r\n \r\n \r\n
\r\n \r\n {showScrollButton && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n )}\r\n\r\n \r\n
\r\n \r\n \r\n \r\n back to top\r\n
\r\n - \r\n {['Home', 'Work', 'Project'].map((item) => (\r\n
- \r\n \r\n
\r\n
\r\n I am a penultimate student at the National University of Singapore completing my undergraduate \r\n degree in information systems. I am a passionate problem solver with a natural curiosity for knowledge.\r\n
\r\n My zeal for innovation and eagerness to learn has led me to work on a variety of software development \r\n projects, where I have developed my technical skills and earned significant experience working in a \r\n team atmosphere. I am excited to use my technical talents and creativity to assist organizations in \r\n developing cutting-edge solutions that foster their growth and success. \r\n
\r\n Feel free to connect with me or contact me at yeoweihan@u.nus.edu\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\n
\n )}\n {`Header inside viewport ${inView}.`}
\nPlain children are always rendered. Use onChange to monitor state.
\n\n *
\n * );\n * };\n * ```\n */\nexport function useInView({\n threshold,\n delay,\n trackVisibility,\n rootMargin,\n root,\n triggerOnce,\n skip,\n initialInView,\n fallbackInView,\n}: IntersectionOptions = {}): InViewHookResponse {\n const unobserve = React.useRef{`Header inside viewport ${inView}.`}
\n *\r\n
\r\n \r\n \r\n
\r\n - \r\n {['Home', 'Work', 'Project'].map((item) => (\r\n
- \r\n \r\n
\r\n Get in touch\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\n\r\nconst BannerRowBottom = ({ title }) => {\r\n return (\r\n \r\n \r\n \r\n I am a passionate problem solver with a natural curiosity for knowledge.\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n scroll
down\r\n \r\n \r\n
\r\n );\r\n};\r\n/* \r\nconst BannerRowCenter = ({ title, playMarquee }) => {\r\n return (\r\n down\r\n
\r\n
\r\n );\r\n}; */\r\n\r\nexport default Banner;\r\n","import React from \"react\";\r\n\r\nconst Image = ({ src, fallback, type = \"image/webp\", alt }) => {\r\n return (\r\n \r\n
\r\n \r\n What I have built\r\n
\r\nProjects
\r\n\r\n {projects.map((project, index) => (\r\n \r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nexport default Project;\r\n","import React from 'react'\nimport { VerticalTimeline, VerticalTimelineElement } from 'react-vertical-timeline-component'\nimport { motion } from 'framer-motion'\n\nimport 'react-vertical-timeline-component/style.min.css'\n\nconst experiences = [\n {\n title: \"Cyber Application Security Intern\",\n company_name: \"Deloitte (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company4.png`,\n iconBg: \"#383E56\",\n date: \"May 2023 - Jul 2023\",\n points: [\n \"Drafted and tailored engagement proposal letters, demonstrating effective communication and presentation of comprehensive project scopes to a client.\",\n \"Prepared over 100 User to Role Matrices using client inputs, ensuring precise mapping of user access and authorizations in complex SAP environments and link several organization matrix data into Tableau for visualization.\",\n \"Automated the extraction and integration of SAP data into Power BI, improving reporting efficiency and insights.\",\n \"Utilized Jira for issue tracking and project management, ensuring efficient coordination and streamlined workflows across teams.\",\n \n ],\n },\n {\n title: \"IT Operations Engineer\",\n company_name: \"Kyndryl (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company3.png`,\n iconBg: \"#E6DEDD\",\n date: \"May 2022 - Aug 2022\",\n points: [\n \"Specialized in providing technical support and maintenance. Deployed, cloned hardware change operations for healthcare technology solutions for thousands of devices.\",\n \"Utilized CRON to automate routine tasks, enhancing operational efficiency in managing healthcare technology solutions. Which includes scheduling regular maintenance activities and system checks.\",\n \"Applied an in-depth understanding of TCP/IP networking fundamentals and expertise in internet service architectures (load balancing, CDNs), enhancing the efficiency and resilience of healthcare technology solutions.\",\n ],\n },\n {\n title: \"IT Assistant\",\n company_name: \"Central Provident Fund Board (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company2.png`,\n iconBg: \"#383E56\",\n date: \"Jun 2019 - Aug 2019\",\n points: [\n \"Collaborated cross-functionally to curate and integrate hundreds of new variables into the organization's data dictionary, strategically paved way for future policy implementations.\",\n \"Cultivated professional relationships with 10+ clients, adeptly discussed the nature of variables and guiding optimal utilization within the data compliance context.\",\n \"Displayed utmost discretion and responsibility in the secure handling and safeguarding of classified information, adhering to the highest standards of confidentiality.\",\n ],\n },\n {\n title: \"Software Engineer\",\n company_name: \"Ngee Ann Polytechnic (Singapore)\",\n imgUrl: `${process.env.PUBLIC_URL}/images/company1.png`,\n iconBg: \"#E6DEDD\",\n date: \"Mar 2019 - May 2019\",\n points: [\n \"Team lead for the development of an autonomous concierge cum security robot in collaboration with Tan Tock Seng Hospital for my final year project.\",\n \"The robot, activated by voice command, navigates predefined points, enhancing security and directional guidance within the hospital\",\n \"Contributed to creating new messages in packages, utilizing CMakeList.txt. Project achievements include improved hospital security, streamlined visitor guidance for 1000+ weekly visitors, and potential applications in various settings.\",\n ],\n },\n];\n\nconst textVariant = (delay) => {\n return {\n hidden: {\n y: -50,\n opacity: 0,\n },\n show: {\n y: 0,\n opacity: 1,\n transition: {\n type: \"spring\",\n duration: 1.25,\n delay: delay,\n },\n },\n };\n};\n\nconst WorkCard = ({ experience }) => (\n \r\n \r\n {project.title}\r\n
\r\n\r\n {project.description}\r\n
\r\n \r\n ))}\r\n\n \n }>\n \n
\n\n \n {experience.title}\n
\n\n {experience.company_name}\n
\n- \n {experience.points.map((point,index) => (\n
- \n {point}\n \n ))}\n
\n What I have done so far\n
\nWork experiences
\n\n \n {experiences.map((experience, index) =>\n \n )}\n \n
\n \n )\n}\n\nexport default Work;","export const store = {\n _origin: 'https://api.emailjs.com',\n};\n","export const validateParams = (publicKey, serviceID, templateID) => {\n if (!publicKey) {\n throw 'The public key is required. Visit https://dashboard.emailjs.com/admin/account';\n }\n if (!serviceID) {\n throw 'The service ID is required. Visit https://dashboard.emailjs.com/admin';\n }\n if (!templateID) {\n throw 'The template ID is required. Visit https://dashboard.emailjs.com/admin/templates';\n }\n return true;\n};\n","export class EmailJSResponseStatus {\n constructor(httpResponse) {\n this.status = httpResponse ? httpResponse.status : 0;\n this.text = httpResponse ? httpResponse.responseText : 'Network Error';\n }\n}\n","import { EmailJSResponseStatus } from '../models/EmailJSResponseStatus';\nimport { store } from '../store/store';\nexport const sendPost = (url, data, headers = {}) => {\n return new Promise((resolve, reject) => {\n const xhr = new XMLHttpRequest();\n xhr.addEventListener('load', ({ target }) => {\n const responseStatus = new EmailJSResponseStatus(target);\n if (responseStatus.status === 200 || responseStatus.text === 'OK') {\n resolve(responseStatus);\n }\n else {\n reject(responseStatus);\n }\n });\n xhr.addEventListener('error', ({ target }) => {\n reject(new EmailJSResponseStatus(target));\n });\n xhr.open('POST', store._origin + url, true);\n Object.keys(headers).forEach((key) => {\n xhr.setRequestHeader(key, headers[key]);\n });\n xhr.send(data);\n });\n};\n","import { init } from './methods/init/init';\nimport { send } from './methods/send/send';\nimport { sendForm } from './methods/sendForm/sendForm';\nexport { init, send, sendForm };\nexport default {\n init,\n send,\n sendForm,\n};\n","import { store } from '../../store/store';\nimport { validateParams } from '../../utils/validateParams';\nimport { sendPost } from '../../api/sendPost';\n/**\n * Send a template to the specific EmailJS service\n * @param {string} serviceID - the EmailJS service ID\n * @param {string} templateID - the EmailJS template ID\n * @param {object} templatePrams - the template params, what will be set to the EmailJS template\n * @param {string} publicKey - the EmailJS public key\n * @returns {Promise\n
\n \n
\n Get in touch
\nContact.
\n \n\r\n
\r\n \r\n \r\n
\r\n \r\n {showScrollButton && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n )}\r\n\r\n \r\n
\r\n \r\n \r\n \r\n back to top\r\n
\r\n - \r\n {['Home', 'Work', 'Project'].map((item) => (\r\n
- \r\n \r\n
\r\n
\r\n I am a penultimate student at the National University of Singapore completing my undergraduate \r\n degree in information systems. I am a passionate problem solver with a natural curiosity for knowledge.\r\n
\r\n My zeal for innovation and eagerness to learn has led me to work on a variety of software development \r\n projects, where I have developed my technical skills and earned significant experience working in a \r\n team atmosphere. I am excited to use my technical talents and creativity to assist organizations in \r\n developing cutting-edge solutions that foster their growth and success. \r\n
\r\n Feel free to connect with me or contact me at yeoweihan@u.nus.edu\r\n
\r\n
\r\n
\r\n
\r\n \r\n