Hi, I Am
Software Developer

Thanapat Suwannaard

I am in love with Coding and find the way to make my code even Better!

thasuohmthanapat.suwanaaard@gmail.com
my image

Education

Kmutt logo
King Mongkut's University of Technology Thonburi - KMUTT
Bachelor of Science Programme in Information TechnologySchool of Information Technology

2019 - Present (4th Year, Graduate around June 2023)

Current GPAX 3.26

Internship

Dek-D logo
Dek-D Interactive Co.,Ltd.
Front-End DeveloperResponsibility : Develop website from Design and make it the best for user~

Between 2022 Jan - 2022 May

Part time 2022 May - Present

My Stack

Development
HTML
JavaScript
TypeScript
React.js
Next.js (Fullstack + My Love)
Node.js
Test
Jest
Cypress
Style
CSS
SCSS
Tailwind (My Love)
Style Component (React.js)
Database
Any SQL Database
MongoDB
Other
Git
Linux

My Projects

1. Dropbox Home page Copy

Dropbox Home page Copy, reference from Dropbox

What I Learn : Practice my skill to create web UI from design.

Build with : HTML, Tailwind

Source Code : GitHub Link

dropbox-copy_image_0
dropbox-copy_image_1
dropbox-copy_image_2
2. Calculator Application

Calculator Application, This project was simple calculator

What I Learn : Practice my javascript and react skills.

Build with : React.js

Source Code : GitHub Link

3. Squid Next

Squid Next, is the online shopping application that user can sell or buy something and review on it.

What I Learn : This project make me learn about authentication (JWT), role handling, Concept to make Infinite-scroll, Redux state management and try to use Material-UI for faster development time

Build with : React.js, Redux, Material-UI

Source Code : GitHub Link

4. Dek-D TCAS calculator 65

Dek-D TCAS calculator 65, the application to help people to calculate the percentage to get into a university and show the requirement score and score ratio for each university. This project still available in DekD TCAS Application on Mobile

What I Learn : This project have use React Query and Style-components that I have never use so I make me learn about React Query at server-side fetching, caching of it so I don't have to make context to share those data but share with React Query, And the one thing I learn is the other way to style with Style-components It's help to easier to find where I style it and handle with JS

Build with : Next.js, React Query, Style-components

tcas-cal-65_image_0
tcas-cal-65_image_1
tcas-cal-65_image_2
5. Dek-D Exam Online

Dek-D Exam Online, the application for students to buy a course to do an exam for preparing for the university.

What I Learn : This project make me learn about make timer most reliable to server, aware user go out of page and there answer lost, offline state, play audio, many choice formats, many UI views for each device, and the version and OS that the user use

Build with : HTML, CSS, JavaScript, PHP

dekd-examonline_image_0
dekd-examonline_image_1
6. TGAT TPAT A-Level Exam topic distribution Program

TGAT TPAT A-Level Exam topic distribution Program, the application to give the user about the topic for each subject and tell how many questions to get the goal score, user can print into the paper

What I Learn : This project help me learn about make page for printing in a paper

Build with : React.js, Style-components

7. OPDC Data retriever Government Project

OPDC Data retriever, the project to handle data, monitor data, generate links, and export data as a .xlsx file and handle permission for user.

What I Learn : In this project I do as fullstack so I learned about the way to create website with Flask and PostgresSQL

Build with : HTML, CSS, Flask

opdc_image_0
8. Share my Book Senior Project

Share my Book, is a project to help people to borrow books and donate the book.

What I Learn : I learn about authentication by the user and login via a google account, role handling with next.js middleware, verifying email and forgot password, socket.io for making the in-app notification, Nodemailer to send an email, Optimize page build with server-side and integrated static generation. In this project i learn a lot of feature that i never use and i make my project even better is UX and Development time and this project is the first time that i make website with Socket.io to make my Website is Realtime Application

Build with : Next.js, Style-components, Socket.io

Source Code : GitHub Link

9. Retrospective Creator

Retrospective Creator, is a completely realtime app with socket.io it use for make retrospective main of this app is create retrospective board, send retrospective comment, and add comment to each other comment and user have to login before use those feature with google account.

What I Learn : Since I try to find what stack does Developer use for Next.js Full Stack I have try Typescript with prisma that make life of Typescript a lot easier, Making next/api with socket.io on both cli and server, After I done this project I know more about how to make Next.js Typescript fullstack and use the pattern to make my code my easier to maintain

Build with : Next.js - Fullstack, React Query, Typescript, Tailwind, Socket.io, Prisma, MongoDB

Source Code : GitHub Link

Contact Me