To start! New Year new weather; First of all, WISH you all good fortune in the New Year. In the Spring Festival these days, the author spent about 4 days to do a simple version of the [schedule] wechat small program. The main purpose of this procedure is two:

  1. Give your girlfriend a gift for Valentine’s Day.
  2. I want to record my schedule and photos of every trip

If your girlfriend asks you to arrange a strategy to go out for the weekend, we may search a bunch of information, and then roughly reply to her in wechat, what time to do what; In fact, a lot of times, we did a bunch of walkthroughs, took a bunch of photos; There is no better correlation between photos and records, and secondly, when friends find us to go to such and such a place, we have to rummage through the closet to find their own records before; Some of our precious photos disappear when we don’t have time to store them in the cloud.

Admittedly, there are a lot of apps or software like “Little Red Book” to do strategy sharing; This kind of App has too many functions and advertisements, which makes it difficult to concentrate on the designated things. There is also want to do a small program to record their own/object travel.

#Let’s see what it looks like

Preface: This small program takes 4 days to complete preliminarily, there are many inadequacies please understand.

#Home page

Main functions of the home page:

  1. Show personally created schedules as well as others’ public schedules;
  2. View personal-related features
Home page – personally created Home page – Public Personal Information page

#How do I create an agenda?

Schedule creation is divided into three main steps:

  1. Fill in the schedule name;
  2. Select schedule time
  3. Fill in the content

The main reason for this design was to reduce the amount of writing lists on mobile; Make it something like XMind, which might be more intuitive.

Create – Enter a name Create – Select time Create – Fill in the schedule

#Preview an agenda

The preview schedule has the following features:

  1. Background Full screen autoplay the uploaded picture;
  2. Click the background image to enter the image preview mode, long press to download the image;
  3. You can view the details of the schedule, click the left button to shrink the details to mini mode;
  4. You can like it or edit the schedule
Schedule details – full preview Schedule details – Mini mode

#Edit a schedule

After we have created the schedule, if we want to upload some pictures, we can choose to edit the schedule; In the editing of the schedule, you can modify the name, time and content again. You can also click to upload your own pictures.

#Other features

In addition to the above features, there are some simple points:

  1. Customize the display sequence of home page and detail page;
  2. Give the programmer a need
Custom order Programmer little brother to demand

#Talk about technology Stack

This public account made a technical blog, and as a qualified programmer little brother is sure to talk about the whole program is what do?

This small program takes 4 days to complete initially, there are many inadequacies please understand.

#Small program

Wechat small program side mainly uses:

  1. Wechat native small program development; (Don’t ask me why, because small program native development is really easy);
  2. The component library part uses the Vant component; The rest are custom components

The project directory is as follows:

#The backend application

The backend technology stack is Koa2+mysql+ Sequlizejs +cls-hooked+redis+typescript

Function points:

  • Unified log;
  • Unified error handling;
  • usecls-hookedUnified handling of affairs;
  • usesequlize, the ORM framework operates SQL;
  • koa-staticDealing with static resources;
  • Supports single file upload and multiple file upload
  • redisThe query cache

The project directory is as follows:

#Experience the

Finally, need to experience it? Welcome to leave a message in the applet or at the bottom