Portfolio

Portfolio

Here’s some of my webdevelopment projects. List of smaller projects https://github.com/vincentntang/sandbox and https://codepen.io/vincentntang/.

Work in progress

  • React/NextJS Q/A knowledge base (4 developers)
  • Flashcard noteapp chrome extension
  • React Markdown Editor
  • Further down the road -> cinemographs / image mixer, UX design tools

React Calculator


December 2018
👉 JS – React

I refactored an original vanilla-js calculator I made previously into React. State is dictated by three values, curValue, formula,andevaluated. ThecurValue holds the current operation / numeric token. formula holds the entirety of everything before eval is made. Evaluated is a flag check to determine if “=” was last command


Canvas Vanishing Art Cube


December 2018
👉 JS – HTML Canvas

A small experimental project using some geometry to calculate how a 3D object can be represented on a 2D plane, using art vanishing points and HTML Canvas. It’s my introduction into basic mathmatical modeling on the web. It doesn’t use anything other than a slope formula though. Read the more here


Techstars Startup Weekend 2018


November 2018
👉 JS – ReactJS – Material UI

This was a three day hackathon that focused on building a solution to a problem. MVP app was to to make a game to associate color to text. Synesthesia is a color stimulas sensation from reading text or listening to music. Target sector is educational space similar to luminosity.com, which is a brain training app. Application was built by 2 other senior developers and me. Contributions I made include: (1) UI/UX into react templating, SCSSs tyling, and user studies.


Nasa’s Spaceapp Challenge 2018


October 2018
👉 JS – Jquery

This was a two day hackathon that I worked on with 2 other developers, 1 design artist, and one business college student. The goal was to create a visual tool to help spread awareness towards NASA’s initiatives. One developer focused on project management/backend. Another on frontend / UI. My focus was on frontend development and exploring datasets. Contributions I made include:

  • Building the business logic for the “Randomize” button – e.g. it takes you to 1 of 195 countries in the world via longitude/latitude.
  • Cleaning GIS data so the “Randomize” button takes you to a country
  • Building API integrations to many tools – NASA API’s, Wikipedia, “#nasa #country” twitter tweets. (some UI / API functionality was not finished in 2 days)

Enterprise Ecommerce Project

April 2018 – now
👉 JS – SASS – JADE/PUG  – ASP.NET
👉 Things Learned:
  • Risk mitigation / content strategy layout
  • Project management
  • Building an entire frontend from scratch
  • RWD (responsive web design) and UX

[not yet live or deployed, work in progress]. This is an ongoing project. Industrial equipment sector with 50,000+ SKUs with low markup margins. Contributions I made include the UX and fully responsive frontend using a pipeline method with prepros, pug, and sass (CSS and HTML preprocessors). From there we work with several different agencies to handle different tasks, some for data management, backend development, custom internal tools for theming. Most of what I do is on the project management side of things. Responsibilities include marketing, data management, content pipelines, risk analysis, and logistics.


Javascript Calculator

February 2018 – April 2018
👉 JS/ CSS Grid
👉 Things Learned:
  • Advanced Javascript
  • Debugging
  • Breaking Down JS libraries
  • Functional Programming vs Iterative/OOP
  • Unit Testing

Early 2018, one of my goals was to deep dive into javascript. I had read all of YKDJS (You don’t know JS) and watched gordon zhu’s practical javascript + premium course. I needed to apply everything I learned to one project. I chose to build a calculator, since it is a good bridge to learn about low-level programming as well. I built this app with functional programming in mind. And learned how to implement a simple MVC design pattern using object literals. The code isn’t the best, in fact it’s partially broken.

All the same, I realized why writing things functionally is not easy. Things behave in iterative fashion. Even if it can be represented functionally. A good example of this is how integrals in calculus works. I learned to appreciate the features a SPA framework like React has to offer. I wrote about my shuntyard javascript calculator on stackexchange here and things I learned from it. I also applied mocha + chai unit testing as well. Code demo is here


Dynalist Plugins


May 2016 – Now
👉 JS / CSS-selectors

Dynalist is a notetaking app that I use everyday. It lets you have infinitely nested outlines. I use it to capture ideas I have, take course notes, log daily sprints & summaries. If I use a webapp long enough, I end up writing my own extensions for it. In this case a CSS theme. Making a stylish theme was quite challenging. Because I had never really popped open the debugger before. Or knew how to use CSS selectors all that well. Plus, dynalist is rather complex in that there’s an infinite number of potential child bulletpoints.

The next thing I made was a userscript extension. It was my first time injecting javascript on a page. I learned how to use tools like tampermonkey as a middleman for injection. And things like greasyfork for hosting the javascript assets. I made a write up of how I developed it here. What the tool does is add a jquery slider on a page, and resizes any img html element. The 3 minute video below explains more details on what dynalist is, the tooling I made for it, and why.


Airtable Plugins


May 2017 – August 2017
👉 Excel VBA / VB6, Windows batchscripting

800 downloads currently. Airtable is a next generation relational database tool. It’s a hybrid of google spreadsheets + microsoft access. I use it to manage product databases at work. However, it was lacking features. Namely

  1. There was no bulk way to upload image files
  2. You couldn’t backup image assets locally

For #1, I created a macro keyboard mouse autohotkey script to solve this issue. For #2, I developed a popular excel VBA script. You can read more about how this script works here and how I went about making it. As well as my thoughts on my code afterwards.

Checkout out this 14 min video where I explain how the bulk image downloader and renamer tool works (for backing up image assets) .I explain what Airtable is, why this macro was necessary, how it works, and what it does behind the scenes here:


Prior to doing webdevelopment, I did work as a metallurgist in research with space-grade metal switches and some work at a fertilizing company. I didn’t really enjoy the slow pace of work I did. Instead, I ended up building and design restaurants for a living. Over the years I have been building tools that people have found useful and that I take pride in. For the past 2 years, I’ve focused mostly on webdevelopment / computer science.

.

.

.

.

.

.

Everyone always seems to want to know about my restaurant design history, so here’s some highlights. I’ve worked with a few famous chefs and high profile clients over the years. And helped layout some of the standards used in the restaurant equipment industry. Benefiting companies like US Food / Sysco. My favorite fun fact is that Chick-Fil-A pioneered a lot of DevOps.

I’ve done everything from working at a restaurant, to consulting, physically manufacturing / welding equipment, installing, 3D cad spec designs, and 2D architectural layouts.

Some highlights:

Planet Hollywood

I spec’d out the design of bar equipment that you’ll see at Planet Hollywood, in Disney Springs. We had it manufacturered overseas, then added green LED’s to it.

 

Morimoto Asia

Disney kitchens are fascinating. For instance, did you know the Disney Polynesian Resort has an interconnected 3 floor kitchen? The top level serves the restaurant, the middle is catering for different services throughout disney, the bottom is leftover scrapes to employees. I can’t show pictures of Disney Kitchens per say since it’s under NDA, but I’m allowed to show pictures of non-disney restaurants on Disney property.

Chef Yuhi who was trained directly under Ironchef Masaharu Morimoto reached out to us. I went over there to provide consultation specs for a new compartment sink. I wrote a fusion360 CAD design to get the unit manufactured locally in town.

Pics of the restaurant in general

From start to finish:

Architectural Layout

Some work, from my very first AutoCAD architectural layout to more advanced layouts used in restaurants I helped startup. Mostly, my expertise came in through design management. Of how different factors (people, menus, pathfinding, safety, permit/county codes, cross-contamination, spacing issues, equipment specs) impact how a kitchen is optimized. It’s not that dissimilar to how offices / warehouses / factories are designed. I’ve worked through layouts from anything to dinner theatres, food trucks, banquet halls, japanese steakhouses, hotel chains, airports, catering operations, etc.