Portfolio
KiwiCivil
ReactJS | NodeJS | ExpressJS | MongoDB | AWS S3&SES
Civil Construction Operational Management App
As a volunteer for KiwiCivil, a local civil construction company, I was responsible for redesigning their existing daily operational management app. The platform streamlines resource management and staff time logging for administrators, while staff members use it to log hours and monitor machinery health. To enhance security, Google reCAPTCHA v3 was integrated.
Three Pines Studio
ReactJS | NodeJS | ExpressJS | MongoDB | AWS S3&SES
Architecture Firm Website
As a volunteer for Three Pines Studio, a local architecture firm, I designed the wireframe using Figma to refine project requirements. Throughout the development process, we held multiple meetings to ensure alignment and progress. This is a demo version; the live deployment utilizes AWS Elastic Beanstalk and EC2, with Google reCAPTCHA v3 implemented for enhanced security.
API Documentation
JavaScript | HTML | Webpack | Bootstrap
API Documentation & Test App
This application is a simplified feel of Swagger, which helps you to document and test APIs in an ExpressJS project with GUI. With vanilla JavaScript and HTML, lite-server is used to run. Webpack bundles multiple JS files and minifies it. Currently available HTTP methods are GET, POST, PUT, and DELETE.
Luise Vuitton
ExpressJS | JavaScript | HTML | CSS | Bootstrap
ECommerce App
This project started as a mini-project at Institute of Data with use of only JavaScript and HTML. Then it's enhanced with ExpressJS backend on NodeJS. The frontend and the backend talk to each other with APIs. Apache Echarts is used to display average price of each items added in the cart. Checkout function would be my next project.
Wines I Don't Like
NodeJS | ExpressJS | PassportJS | EJS | Bootstrap | MongoDB | OAuth
Wine Tracking App
My first project with Node.js. The database uses MongoDB hosted on Atlas. I kept buying the wines I didn't like so this application was born. Simple yet so helpful during my bottle shopping. It will add a new entry as well as searching through existing lists. OAuth with Google and Facebook are configured as well as email sign in. Passport.js is used for authentication.
Family Calendar
Django | HTML | CSS | SCSS | Bootstrap | Javascript
Scheduling App
This application allows me and my family to schedule tasks as well as see whole family members' schedules at once. Date specific todo items related to each member appear on today's date, so that on the right day those cards will remind the member what agenda he has. Then once it's complete, the card can be removed to create a sense of achievement! Aside from the main scheduling tool, a lot of informative APIs such as Weather, News, Covid etc to make this application more fun. This project integrated my newly obtained skill, Javascript, into Django, which is used in clock, baloons, and greeting in the navbar. Along the way, also SCSS is used. Please use test credentials (username:testuser, password test123456).
FreeStuff
Flask | HTML | CSS | Bootstrap |PostgreSQL | Amazon S3
Commerce App For Free Items
As a capstone project for Flask Web Development course in CodingNomads, I was excited to be able to fully integrate most of the topics I learned in addition to some new extensions, libraries and technologies such as AWS S3 bucket and search module etc. Whilst it was tough going, this project has given me more confidence in knowing I can always find solutions to coding challenges that may arise. I wanted to build something to showcase my capability of creating real-life applications. This application will be used for Japan Kauri Education Trust in Auckland.
JKET Parent Registration
Django | HTML | CSS | Bootstrap
Visitor Registration App
Currently my daughter's Japanese language school Japan Kauri Education Trust in Auckland are using a more traditional pen & paper system when parents drop-off/pick-up their children. I built this web app to try to introduce a more modern system and I used it as my Django capstone project and JKET. This simple application allows JKET admins and parents/guardians to have a central location to record drop-offs/pick-ups as well as to check history logs - not to mention saving on paper cost! The live version is up and running.
Remember Coco
Django | HTML | CSS | Bootstrap
Expense Tracking App
My long-lasting dream from the beginning of Django learning. As a typical teenager who is often forgetful of certain things, my daughter loves hanging out with friends and treasures her mobile phone. I developed this mobile-friendly app so she can digitally keep track of her repayments whenever she has borrowed money from me.
Kikki Kopski
Flask | HTML | CSS | Bootstrap | HTML5UP
Artist Website
I studied Metalsmithing at Savannah College of Art and Design in Savannah, Georgia, USA back in 2002. I used to use a paid service (wix.com) for my jewllery website but with my freshly obtained web development skills, I can now save money by creating my own website! For the template, I used HTML5UP and learned how to integrate 3rd party code base into my own website. It gave me a lot of great ideas for frontend development that I wouldn't have thought of. This is a work in progress as I continuously think of creative and improving ideas to keep adding to the site.
NZD-JPY Exchange
Python3
Alert Notification App
Being from Japan and living in New Zealand, I need to keep an eye on currency exchange rates to transfer money. As a mother of 3 children plus a dog, there are plenty of things to juggle throughout my day and exchange rates are the list thing I want to be keeping track of. To facilitate the process and keep me up to date, I created this mini-app using crontab in my Ubuntu environment and sends me an email when the currency rate goes below certain price criteria.
TradeMe Rental Search
Python3 | Selenium
Task Automation App
While deciding how much we should be renting our rumpus room for, I created this program that automatically collects certain conditions of a rental property to a separate Google Form. It then lists them in a csv file so I can see the information immediately. By changing the search filter, I can search in different locations, or for purchasing property to find out the average price range, the number of rooms and bathrooms.