Zhexuan Liu

This project was done for Microsoft.

This is a project which migrated the Office Group service from SharePoint and also integrated it with the Microsoft Dynamic CRM.

It is a classic single-page application (SPA) that uses TypeScript, Knockout.js, and LESS. It allows CRM users to create, join, and manage their own group as well as Office resources (documents, sheets, emails, conversations, and more) in the group. This is the project is one of the crucial projects for the One Microsoft strategy as it offers users the one-stop experience in Microsoft Dynamics.

For the back end, it uses C# and .NET to migrate the back-end endpoints and APIs from SharePoint and uses the One Microsoft's OAuth portal to handle account registration and management.

I was the core developer of version 1.0 of this project and owner of version 2.0 and version 2.5 of this project. I also took charge of the implementation of the accessibility and localization for the entire project.

This project was done for a Toptal client, B.B.E. (Bbe.io), and it was a small static sever-side-rendering website project that reworked their official website (their original official website is at the provided link).

In this project, I set up and bootstrapped a project, determined the tech stack to be used, designed the project architecture, handled the development and deployment, and wrote detailed documentation.

I used Nuxt.js to develop the website and also introduced TypeScript, and Vue-property-decorator to help improve the coding and development experience and quality. In addition, I also leveraged libraries such as moment, Vuex, Vue i18n, and Sass to achieve desired features from my client. I broke down the design to specific and reusable Vue.js components, and made them data-driven, which means data is separated into a corresponding JavaScript file and could be later easily replaced/hooked with the client’s CMS back end.

During the entire engagement, I communicated with my client every day to sync my progress as well as asking questions in the early stages.

This project is also done for my Toptal client B.B.E. (Bbe.io). In fact, this project was not scheduled in the original plan, but was scheduled before the previous project (i.e. B.B.E. Official Website) was finished, as they would like to extend my engagement to work with this project.

In this project, I made full commitments in setting up and bootstrapping the project, determining the tech stack to be used, designing the project architecture, development, deployment, and detailed documentation.

This project involved migrating their old website (Fliteboard.com) which was written in WordPress and PHP to Nuxt.js and to remain exactly the same. In other words, my responsibility was to rewrite the website by Nuxt.js, and make the website data-driven so that they could easily plug it with their CMS back-end.

I used pure JavaScript to write this project and utilized Nuxt.js to implement it as a server-side-rendering website. In addition, I leveraged libraries such as Vue i18n, Font Awesome, Vuex, Slick Carousel, Fancybox, and Turntable.js to implement the desired features from my client. Moreover, I broke down the entire website into highly reusable Vue.js components and implemented them with clean and well-commented code.

An iOS application to communicate and operate with DJI drones. With this application, end users can easily:
1. Create a flight mission and plan flight routes for DJI drones.
2. Invite other users to join a mission and share real-time images as well as drone operations.
3. Develop functional packages for customers from different industries.

The application consists of two parts:
1. Native application to handle user login, account management, and mission creation.
2. Inside a mission, views are built with a lightweight React Native-like framework (i.e., the envoy framework we built and mentioned in my portfolio).

One could log-in into the application to play around with the following credentials.

phone: 18344408081
password: Eric911216

A milestone project for Microsoft Dynamics.

The project is a model-driven app and it was built using TypeScript and React together with many useful libraries such as Moment.js and so on.

Starting from the very first stage, I participated in the design of the app state and most of the controls such as the grid, dialog, dropdown, sidebar, navbar, breadcrumb, forms, timeline, search, tab, and more.

After the designing and prototyping stage, I participated in the implementation (both the CSS and React) of the whole project—owning the dashboard page, dialogs, and activity pages as well as the controls inside these pages. Moreover, I worked with the team to deliver on the accessibility and localizations for the pages I owned. Additionally, I also helped with back-end portal implementation using C# and .NET.

Task Based Experience is a service/feature in Microsoft Dynamics 365 that enables users to focus on tasks and brings data from different entities together as a one-stop user experience.

In this project, I participated in the implementation of the task flow process, the card control, and the form control as well as the accessibility feature. The back-end portal for this project was already fully supported so we are mainly working on this project for the client-side using C# and .NET.

This is a cross-platform application running in production currently, serving hundreds of Kiwi Inc.'s enterprise clients in mainland China.

The project is an application based on the famous electron library, together with Vue.js and TypeScript. I designed the whole architecture of this application and implemented it from scratch, including all of the controls, pages, state management, file system, interaction with the back-end (and related back-end APIs as well), localization, Webpack packing, and deployment.

It supports both Windows and macOS and is structured well and commented.

The official website for Kiwi, Inc., developed by the SSR framework Next.js and deployed using Docker.

Now this project is running in production serving our company (Kiwi, Inc.) to introduce our products and our teams to hundreds of enterprise clients in mainland China and several in South America.

Inside this project, I applied my React knowledge and experience to structure the project architecture and used Qiniu (Qiniu.com) as a CDN service for any static resources. In addition to the built-in Webpack configuration supported by Next.js, I added customized PostCSS rules and JSX rules for better development experience. Now the project is using the latest Next.js framework which I just migrated from v2.0+ in October 2018. Moreover, this project is already localized for both English and simplified Chinese, and it is highly maintainable.

Currently, this project is deployed on the Aliyun server.

A working demo which helps route-planning for a drone's flight on a general polygon area.

Inside this demo, I used the Gaode Map API for demonstration and display purposes.

In this project, it will accept an array of vertices representing any polygon and outputs a series of vertices representing the ordered route for a proper drone flight covering the whole polygon area.

In this project, I applied an algorithm and geometrical knowledge to calculate the dot product/cross product of two vectors, the vector intersection, to check whether a point is inside a polygon, to count intersections between a vector and a polygon, and to obtain the type of polygon. Moreover, I used the A* algorithm to find the optimal path between two points inside the polygon so that the path will not step outside of the polygon.

The output of this demo is now used in our production Mesh application and serving our clients in the architectural industry.

This is a tool for front-end development in Kiwi, Inc., a uniformed development CLI tool that helps bootstrapping, building/compiling, testing, and deploying a Vue.js application.

This development tool contains Webpack configuration for projects developed with Vue.js and TypeScript in different environments. It allows users passing in global environment variables that could be used in the web project.

This development tool is a CLI tool which enables a user performing expected actions by passing inappropriate parameters (user could type -h) for help. It also supports deployment and Slack notifications. Once the project is built, a user could fork the project and update the server and Slack token for customization.

A lightweight JavaScript engine used by Kiwi, Inc., enabling JavaScript developers who are quickly developing to control and communicate with DJI drones and other devices.

This project applies the logic of several front-end frameworks such as Virtual DOM, change detection, and so on. It also defines the lifecycle of a typical envoy component.

It utilizes the popular library snabbdom to handle the virtual DOM and change detection and also implements a change queue to allow the registering, monitoring, and management of changes. Additionally, it provides an event manager which includes an event emitter, allowing custom-event forwarding and receiving across different devices (e.g., iOS devices).

A modified version of MobX, specifically developed for the JavaScript engine "envoy" used in Kiwi, Inc.