Portfolio
Multi-user, microblogging application by Ruby on Rails and Vue.js, revised version of Rainy Day Blog. A user authentication is done by OAuth2 Authorization Code Flow or PKCE(Proof Key for Code Exchange) for Google and GitLab, OAuth2 for GitHub. The authentication feature was created from scratch to work smoothly with the front-end by Vue.js. The back-end provides GraphQL API to read/write posts and comments. For this feature, the back-end uses GraphQL Ruby, while the front-end uses Vue Apollo. The application allows nested comments.
The back-end is Rails 8 with PostgreSQL database, RSpec for unit testing, and Vite Ruby for Vue.js integration. The front-end uses Tailwind CSS, and is designed to be responsive. Also, it provides a feature to toggle light/dark mode. The front-end framework is Vue.js 3, Composition API. Its logic is written by TypeScript. With Vue.js, the application uses Vue Router, Pinia, Vite and Bun.
The repository has GitLab CI/CD configuration which creates a Docker image after successful testing. When the updates code is pushed or merged to the main branch, the application is deployed to Render.
Multi-player, multi-board, realtime Tic-Tac-Toe game application by Ruby on Rails and Vue.js To provide a realtime feature, the application uses WebSocket by Rails’ Action Cable. Instead of database, Rails low-level caching is used considering a running cost when it is deployed. The cache saves player’s names and all game statuses. The back-end is tested by RSpec including Action Cable behaviors.
The front-end is written by Vue.js, composition API with TypeScript, Pinia, Vue Router, VueUse, Vite and Bun. Tailwind CSS is used also to provide a responsive design.
The application is deployed to Heroku through GitLab CI/CD pipeline.
Front-end only application. A complicated nested state update example. A single option change affects other options’ state. The options have levels and priorities. When a higher level option turns on, all lower level options turn on as disabled status. When a lower level option turns on, higher level options becomes disabled. Each level of options has a priority setting. When a higher priority option turns on, the same level of lower priority options turn on as disabled.
The application is written by Vue.js 3, Composition API, with TypeScript, Vite, and Bun. The option switch behaviors are tested by Vitest. Styles are defined by Tailwind CSS. The UI is responsive and has a switch of Light/Dark mode.
The working application is deployed to GitLab pages through GitLab CI/CD pipeline.
Front-end only application. This project is for Tailwind CSS study, and has six static websites. All those websites are great materials to learn about web page designs. Needless to say, all web pages are responsive. Addition to the six websites is Vue.js, which provides a routing and interactive features. Along with Vue.js, the application uses TypeScript, Vue Router, VueUse, Google Fonts.
The application is deployed to GitLab pages through GitLab CI/CD.
Multi-user, microblogging application by Ruby on Rails and Vue.js. A user authentication is done by OAuth2 PKCE (Authorization Code Flow with Proof Key for Code Exchange) for Twitter. The authentication feature was create from scratch to work with Vue.js app. The back-end provides GraphQL API to read/write blog posts and comments. The GraphQL implementation is done by GraphQL Ruby for the back-end and Vue Apollo for the front-end.
The application uses PostgreSQL as database, Redis as session storage, RSpec as unit testing, and Vite Ruby to integrate the front-end.
Along with Vue.js 3, composition API, the front-end uses Vue Router, Pinia, Tailwind CSS and Daisy UI.
A proof of concept application to create a transcript from English to Japanese Katakana. The idea might help text to speech or English word to Japanese sound notation.
The application consists of two parts: Web application and Transcript engine. The web application provides a GraphQL endpoint. The transcript engine has a main feature of creating transcripts. Flask is a web framework for this app, while the engine is written by a simple Python.
Multi-user, microblogging application by Ruby on Rails and React. The application accepts text only for post/comment input. A user authentication is by OAuth2, Facebook as an OAuth provider. Reading posts/comments doesn’t require the authentication, while writing posts/comments requires.
The application uses PostgreSQL, GraphQL and React/Redux.
A well-known snake game implementation by C++. The project was created to study C++. As a tweak, the app has two snakes; one moves by manual input, another moves automatically, optimally, to find a food quickly. The app has one more tweak of a toxic food. The toxic food appears randomly. When a snake hits the toxic food, snake’s length is cut down.
This project is Natural Language Processing, one of Deep Learning applications. Jane means an acclaimed British novelist, Jane Austen. Her famous novels, Pride and Prejudice, Sense and Sensibility and Emma, are the training data. Entire three novels were fed to a Deep Leaning model to learn word to word sequences. After the training and model tuning were performed enough, Jane’s novel-like sentences were generated given the first key word.
Details about the project is put together in the PDF file, Report.pdf.
For this project, NLP model was designed to handle Jane Austen novels well using TensorFlow.
The repository has multiple Deep Learning projects. DCGAN by PyTorch to detect Street View House Numbers, CNN with transfer learning to detect God breeds, RNN to generate TV script using Simpsons’ TV script, Deep Reinforcement Learning to fly the quadcopter and others.