The classmate who always calls me master Guo entered Baidu. I was happy for her, but also a little bitter. Same occupation, I still wander in small company struggle, somebody else has been out of the sea of bitterness. Weak foundation! Can not calm heart! Technology dabbles! More than five years of experience is still like a novice can only move bricks!!

Since writing a blog can accumulate their own knowledge system, become an interview plus. Then do it!!

Build a zero cost blog webpage to oneself, refueling guo master!!

Make the home of guguo with your own hands

1. How to start?

As developers, we all know that to build a blog, you need at least a server to store the blog page and a domain name to access the outside world. In this friendly, good-natured world, are there any philanthropists who give us this stuff for free?

Here are a few alternatives

  • Github Page (mobile users need to climb over the wall, in half-wall state, so give up)
  • Coding Page (final choice)
  • gitee page
  • Free development of LeanCloud
  • Ali Cloud OSS save pictures (basic no money, use small space when no money)

Try it with the stuff on top.

Two. Try feasibility

  1. Open github Pages and refer to this blog
  2. Build a simple app demo with Flutter
  3. Compile web artifacts and push them to Github (or Gitee or coding)

Tears filled my eyes. After some operation, I successfully opened my demo page on the web page.

However, it’s hard to avoid stepping in potholes. Here are a few small potholes I encountered

  • The Display of the Flutter web page shows the Chinese {mouth} first and then correctly after a while

The reason why Flutter Web runs with this bug is that if the render mode is canvaskit, you can force the render mode to be HTML

Add the parameter flutter build Web — Web-renderer HTML at compile time

  • Push the product to Github, open the url display is blank??

Push again and everything will be normal.

  • Ali cloud resolution domain name is not available, and finally use the new network resolution
  • The Github Pages page had some networks that were inaccessible, needed to go over the wall and was full, and finally switched to coding web hosting

3. Build leanCloud back-end cloud services

Create an account in LeanCloud and create an app. Use the development version of the cloud storage, free 30,000 requests a day ~ ha ha ha is completely enough

If you do not have a registered domain name, leanCloud can only use the international server, which is very slow

Create a cloud storage table

Leacloud comes with several tables, and I used the built-in _Role and _User tables, which are the role and user tables

It’s very simple to use in my scenario. Role specifies three types of roles

  1. Administrator (admin) ————— Myself
  2. Common user (normal) —— Common users are temporarily unavailable
  3. Tourist – – the default login account of tourists when someone visits the blog

Then there is the user table and the article table. Needless to

The back-end interactions

Because leancloud does not currently have the SDK for flutter web, the way the web front end interacts with the back end is the way the restfulapi does

Ps: Cloud storage has an SDK for the Flutter client, which is not used because it works on the Web

For details, see official documents

Main development process

  • Homepage visitors log in + get the list of articles
  • The administrator can upload and delete articles through the hidden entry
  • end

Iv. Produce results and deploy them

After three or four days of trial and trial and king of Glory (successfully hit the king), finally reluctantly available version deployed to coding hosting website.

The page is simple, a few pictures can be shown directly.

guuguo.top

End five.

I was always falling behind and stumbling behind people. Looking at other people’s happy life, high salary, silently envy

You always have to step out of your comfort zone, and it’s better to hit the wall and go back than to stay back forever

Once you take the first step, you just keep going