Claude Vernet Michel

Frontend Developer

  Kaohsiung City, Taiwan

Logical and results-driven Web Developer dedicated to building and optimizing user-focused websites for customers with various business objectives. Judicious and creative when crafting effective websites and platforms to propel competitive advantage and revenue growth. Technically proficient and analytical problem solver with calm and focused demeanor.


     

Work Experience

Frontend Developer

巴克斯數位股份有限公司(Box Digital)  •  June 2023 - Present

Key Responsibilities:

- Collaborated closely with UI/UX designers on multiple concurrent projects to ensure seamless integration of design and functionality.

- Translated customer requirements into web and mobile applications, delivering tailored solutions that met their unique needs and specifications.

- Interacted with English-speaking clients to gather project requirements and create web applications tailored to their needs.


Projects:
1- Box Digital's official website
- Developed Box Digital's official website from scratch utilizing Next.js and TailwindCSS.

- Enhanced site performance by optimizing asset loading, ensuring only essential resources are fetched on initial page load.

Official Website Link: https://www.box70000.com/zh-TW

Tools used:
- NextJs, TailwindCSS

2- Shoe Management Platform
- Created a comprehensive shoe management platform with robust authorization features.

- Implemented functionalities allowing administrators to seamlessly upload shoe images and relevant information.

- Provided users with an intuitive interface to browse shoes based on their specific preferences and needs.

Shoe Management Platform Link: https://footwear.dev.box70000.com

Tools used:
- NextJs, TailwindCSS, React Tanstack query, Axios, Ant design


Frontend Developer

Bloxmith  •  August 2022 - January 2023

Leaving Reason: The company did not follow the contract terms due to financial issues and ceased operations as of April 17th, 2023.

About Bloxmith: Bloxmith is a gaming company that integrates blockchain technology into its offerings.

Key Responsibilities:

As the sole Frontend Developer in the development team, contributed to the development of two web platforms.


Platform 1: Internal Monitoring Website

- Designed and developed an internal website for monitoring Bloxmith's game app, displaying player data, and more.

- Utilized the following tools:

- Next.js for frontend development.

- Chakra UI for user interface components.

- Implemented Responsive Web Design (RWD) with CSS3.


Platform 2: NFT Marketplace (Dapp)

- Collaborated with the backend team to create an NFT marketplace for selling Bloxmith game app avatars using the Blocto wallet.

- The smart contract for this platform was written in Cadence and handled by the backend team.

- Implemented the frontend for the NFT marketplace, with the following responsibilities:

- Retrieving avatars from the backend via API, offering filter options (Latest, oldest, cheapest, highest price, etc.).

- Displaying unique avatars retrieved from the backend via API.

- Facilitating user buy events, connecting wallets, and initiating buy API calls to the backend.


Tools Used:

- Next.js for frontend development.

- Chakra UI for user interface components.

- Implemented Responsive Web Design (RWD) using CSS3.


Key Skills Developed:

- Frontend development using Next.js.

- User interface design with Chakra UI.

- Responsive Web Design (RWD) using CSS3.

- Integration of blockchain technology for NFT marketplace.


網頁前端開發工程師

BLD Energy 百立達科技股份有限公司  •  March 2022 - July 2022

Leaving Reason: The startup ceased operations due to financial issues.

Key Responsibilities:

-Developed a cutting-edge web application as the sole Frontend Developer in the development team.


Utilized the following tools and technologies:

- Next.js (React.js)

- NextAuth for authentication

- CSS3, HTML5

- Vercel for deployment

 - Chart.js for Data Visualization


Notable Project: PowerTrade

PowerTrade is an innovative web application with two primary features:

- Real-time Energy Consumption Visualization:

Designed and implemented a feature that enables users to visualize real-time energy consumption (electricity) on the web app through the BLD energy monitor installed in their homes.

- Energy Savings Rewards:

Developed a feature that allows users to earn rewards whenever they save energy.


Implementation:

- Leveraged Next.js, a React.js framework, for frontend development. Next.js provided server-side rendering for enhanced performance.

- Implemented authentication using Ory Hydra/Kratos and NextAuth to ensure secure access to the platform.

- Designed HTML/CSS elements from scratch, creating a user-friendly and visually appealing web application.

- Integrated Chart.js for data visualization, enhancing the user experience.

- Employed API calls (GET/POST/PUT) to fetch data from the backend, ensuring real-time and dynamic content.


Key Skills Developed:

- Next.js (React.js)

- Authentication using NextAuth

- Frontend development with HTML5 and CSS3

- Deployment on Vercel

- Data visualization using Chart.js

- API integration for dynamic content


Web 前端開發工程師

Moldex3D ( CoreTech System Co. Ltd.)  •  March 2020 - February 2022

Key Responsibilities:

Built web-based applications with my team using the following technologies:

- Angular, CSS3, HTML5

- UI/UX design

- D3.js, Chart.js for Data Visualization

- JavaScript Calendar (FullCalendar, Tui Calendar)


Project Management:
- Taking ownership of all projects that required communication in English with external teams such as SIEMENS' team.
- Collaborating with engineers from various countries, including the US, UK, India, and China.

Management Skills:

- Instructed and mentored interns to ensure the proper execution of tasks.

- Assigned and supervised tasks for interns, fostering a collaborative work environment.


Notable Projects:

Platform 1: Material Display System

- Developed a web-based system to display company materials using various types of charts (e.g., pie, bar, line, scatter, and radar charts).

Demo: https://mhc.moldex3d.cloud/


Implementation:

- Utilized Angular for frontend development.

- Created web pages using HTML/CSS.

- Implemented data visualization using Chart.js.

- Leveraged API calls (GET/POST/PUT) to fetch data from the backend.


Platform 2: E-Learning Platform

- Developed an e-learning web-based platform that allows users to learn and take quizzes for a better understanding of injection molding.

Demo: https://university.moldex3d.cloud/


Implementation:

- Utilized Angular for frontend development.

- Implemented web pages with HTML/CSS.

- Integrated an HTML5 video player to display course videos.

- Utilized API calls (GET/POST/PUT/DELETE) to retrieve data from the backend.

Key Skills Developed:

- Frontend development (Angular, HTML5, CSS3)

- Data visualization (D3.js, Chart.js)

- Calendar integration (FullCalendar, Tui Calendar)

- API integration for data retrieval

- Mentorship and task assignment



Implementation Engineer Intern

Ematic Solutions  •  July 2019 - January 2020

I have joined Ematic Solutions as an Implementation Engineer. The major part of the work is to:
- Handle data management and integration projects on different digital marketing platforms.

- Prepare data specification and integration for customers.

- Work collaboratively with cross functions departments to constantly provide solutions and deliver performance for customers.

- Take ownership of customer issues reported and seeing problems through to resolution.

- Interface with customers on a regular basis, working with their marketing and development team to ensure successful on-boarding and long-term success.

- Follow standard procedures for proper escalation of unresolved issues to the appropriate internal teams.

Projects




Display Taiwan's Government API in a Reactjs web app using HighCharts

This project displays the population, number of households by household and gender statistics of Taiwan using the government's API.

Demo Link: https://big-data-front-end.vercel.app/

Github Link: https://github.com/ClaudyV/big-data-front-end




Lazy Loading react web app

This project is a sample react app that filters results upon search. Users can set the page size for the results and then the results will be displayed accordingly with infinite scrolling.

Demo Link: https://page-layout.vercel.app/

Github Link: https://github.com/ClaudyV/page-layout


Single Web page app

I have developed this website using: 

Front-End: Angular, CSS3, HTML5 from scratch
Back-End:  Firebase (Hosting).

Link: https://casana-demo.web.app/#/home

My kid's Mentor

My Kid's Mentor is a platform for kids which offers help and advice to parents via courses on topics such as kids being bullied in school or kids' behavior.

Demo link: https://my-kid-s-mentor.firebaseapp.com/


Technology used: 

- Front-end (Angular, CSS3, HTML5) from scratch

- Back-end: Firebase (Hosting, Authentication, Realtime Database, Storage)



Image Compressor

This project is a free image compressor built with the following tools:

-    Angular

-    NgxImageCompressService (built-in image compressor library)

-    HTML5, CSS3

Demo link: https://compressthat.firebaseapp.com/

Display weather API

Steps taken in this project:

1- Retrieve weather API data

● Use a table to display the original data.

● Add filter, search, sort features for the table.

2- Build a back-end system with Node.js, Express.js, MongoDB to store api data in a database. Update the data in the database every hour. 

3- When the original API link is not available, use the data in the database as a backup for the Table.

Link: https://github.com/ClaudyV/weather-web-app


My portfolio

Usually, I explore new technologies by creating projects. It’s been a long time since I wanted to learn React.js, so I decided to build my portfolio with React.js

Link: https://claudyv.github.io/claudy/


API calls to achieve Mailchimp's tasks

In this PHP project, I used MailChimp's RESTful API to do the following tasks:

1-Create a Mailchimp list

2-Add new users to the list 

3-Sending out a campaign from Mailchimp to everyone in the list

Link: https://github.com/ClaudyV/PHP-Assessment-Test

Education

2016 - 2020

National Chiao Tung University

Computer Science - Bachelor's Degree

2015 - 2016

National Central University

Chinese Learning (Language Center)

Skills

Frontend Development


  • Nextjs
  • reactjs
  • Angular
  • HTML5
  • CSS3
  • RESTful API
  • Git
  • CI/CD

Language


  • Chinese
  • English
  • French
  • Haitian Creole