Attack on Life ⚔️

Recently, I used Monaco editor to implement an SQL editor. To improve the user experience, code auto-completion was necessary. After some research, I found a solution, so I’m marking it down here.

Built-in Autocompletion?

YES, Monaco supports some built-in languages by default, such as JavaScript, TypeScript, CSS, JSON, and HTML. You can achieve code autocompletion for languages with built-in support simply by setting the editor language to JavaScript`.

However, for languages like SQL that do not have built-in support, setting the editor language to SQL only enables syntax highlighting.

Recently, because of Claude Sonnet and Cursor, I started contacting Claude. After using it for a while, I found that Claude is quite good; at least, I feel it’s on par with ChatGPT at the moment.

Here I’ll mark down some usage tips.

Requirements

• VPN
  • This is similar to ChatGPT; both require solving network issues.
  • The list of countries supported by Claude can be found here.
  • If the proxy network is not good, account suspension is likely later.
  • You can refer to my proxy solution for those who haven’t solved the VPN issue.
• Foreign phone number
  • Google Voice is not supported; using a GV number to receive an SMS verification code will result in an immediate error.
  • Getting a foreign SIM card, such as Giffgaff, is impossible if you don’t have one.
  • Using SMS verification code platforms recommended online may result in a higher chance of not receiving the verification code.

Register

Technical reviews are required for functions that take more than three days to develop, so drawing skills are essential.

My company encourages the use of draw.io for drawing, and the more I use it, the more amazing I find this tool. So, regarding its usage, here’s a basic explanation for marking.

Platform

Draw.io is free and cross-platform.

• Web

• App

  It uses Electron, so it supports various OS.

Open Source?

Can environment variables be set when connecting to a server using the Node.js SSH2 client? After investigation, it was found that it is possible. Just marking it here.

Setting Environment Variables

The code is as follows:

1
2
3
4
5
6
7
8
9
10
11
12

this.conn.shell({
        env: {
          X_LOGIN_IP: '128.1.1.123',
          X_ENVIRONMENT_VARIABLE: "desiredvalue"
        }, term: 'xterm-256color', // term: 'dumb',
        cols: connectOpts.cols, rows: connectOpts.rows,
      }, (err, s) => {
        if (err) {
          console.log('ssh shell error', err);
          throw err;
   }    
})

Limitations

Recently, I received a front-end issue about garbled text caused by the user’s network disconnection and recovery. After investigation, I found that the issue was caused by the WEB’s lack of monitoring and handling of network changes. Here are some methods to mark.

Monitor Network Changes

Monitor network changes through the online/offline events. For example, the offline event is triggered when Wi-Fi is turned off, and the online event is triggered when it is turned on.

1
2
3
4
5
6

window.addEventListener('online', () => {
  console.log('Network is online');
});
window.addEventListener('offline', () => {
  console.log('Network is offline');
});

Check Network Status