Tencent Cloud and CODING, CloudStudio, the cloud IDE, first experience

Article published at. https://abelsu7.top/2018/04/16/try-cloud-studio/ Author: Su Yi Bei, please specify the original link

Introduction to Cloud Studio and Coding WebIDE

On April 16, Tencent Cloud and CODING announced a strategic cooperation, jointly releasing to Tencent Cloud Cloud Server grounded The first completely cloud-based IDE tool in ChinaCloud Studio The beta version of the

Cloud Studio, which went live on April 16

differ fromHeroku suchPaaSCloud Studio, according to the two in the WeChat push, is closer toSaaS The concept - which is essentially a Online cloud-based development tools to reduce the cost of installing IDEs for users, and with Tencent CloudIaaS/PaaS Deeply integrated, thus providing Code writing, debugging, go-live A one-stop, closed-loop experience.

Coding provides front-end IDE, Tencent Cloud provides back-end computing services

Cloud Studio is the predecessor of CODING's self-developedCoding WebIDE , veteran users of CODING should be familiar with it. The login screen of Cloud Studio still retains the access portal hint of the old WebIDE version, so that old users can continue to access it.

Coding WebIDE

It's worth noting that the front page of WebIDE explicitly mentions that the underlying layer is based on Container Technology It allows you to reduce the warm-up time of the system from minutes to seconds, and the configured development environment can be saved and shared quickly.

WebIDE is based on container technology

And the Coding WebIDE derived from theCloud StudioThe same use of Container Technology This is evidenced in the WeChat tweet released by Tencent Cloud, which is partially excerpted below.

"Software development is becoming more efficient and development tools need to be updated and iterated in parallel, which places higher demands on computing resources. Behind every Cloud Studio, there are Tencent Cloud servers, container services and other services providing computing support., Helping users upgrade their development model、 Change of application delivery、 Restructuring the way data is managed, Accelerating Enterprise Application Deployment。 Relying on Tencent Cloud of Powerful resilience, It is also able to do a quick reach of resources、 disaster recovery, etc.。 developers useCloud Studio You can program when you log in to your browser, Provide complete of Linux environments and and supports custom domain pointing、 Dynamic computing resource alignment, Various applications can be completed of Development compilation together with deploy。 additionally, everyone Cloud Studio own of computing resource, Support for fast switching between multiple environments、 Co-editor、 full-featured Terminal other functions。 it is reported that, the next step,Cloud Studio Resources will be open for redeployment、 (located) at wire Terminal Operating cloud resources and other functions。”

Without further ado, let's take a first look at Cloud Studio~

Sign up for a CODING account

Cloud Studio is a joint service provided by CODING and Tencent Cloud, so naturally we need to sign up for an account with both of them. interviewshttps://studio.coding.net, With that jump toCODING Account login screen, Because I've done it before. beCODING of user, Direct Login, go into the next step。

Sign up for a CODING account

Apply for Free Trial

After logging into your CODING account, the system will first detect if you already have a cloud host. First time logins can apply 30-day free trial . According to the official statement, after expiration it is available at a rate as low as 9.$9/month prices Renewal Hosting , you can say it's a good deal.

Apply for free trial

The interface also has Products harmony Help Documentation of Access Links, formal go intoCloud Studio You might want to take a stroll before。

Cloud Studio Product Description

Highlighted features include Multi-Environment Switching Co-editor and Full-featured Terminal, Terminal default useoh-my-zsh Good review!

Multi-Environment Switching
Full-featured Terminal, defaultoh-my-zsh

Back to business and continuing our journey through the Cloud Studio experience.

Tencent Cloud authorisation

After applying for a Free Trial trial, the system will automatically apply for a 1 core 1GB, 10G space of Tencent Cloud Hosting asCloud Studio of backend server, If you have not previously bound to Tencent Cloud of account number, This will jump to Tencent Cloud of authorisation pages , click authorisation That is all. barring unforeseen circumstances, would have go intoCloud Studio of In the main interface。

Tencent Cloud authorisation

commencement useCloud Studio

Cloud Studio With a broad of use scenario。 (located) at In its official presentation, will Development of WeChat small programs is shown as an example scenario.

Development of WeChat small programs

In addition Cloud Studio supports Co-editor harmony chats The features of the official introductory image as an example.

Co-editor together with chats

The default workspace is created when users first enter Cloud Studio, or they can create an empty project or import an existing project from CODING. You can see the style of the IDE andIntelliJ IDEA Very similar.

Managing Workspaces

Cloud Studio comes preconfigured withNode.jsJekyllHexoPHPRubyJavaPython.NetMachine Learning (yes, you read that right) and many other development environments that users can use inEnvironments tab to quickly switch between them.

Quickly switch between multiple preset development environments

(located) atGeneral Setting in which it is possible to right Interface display language and File tree to hide files Make the settings.

General Setting

(located) atAppearance Setting in which it is possible to Switching light/dark themes and Set code highlighting color scheme , the default ismaterial

Appearance Setting

(located) atEditor Setting in which it is possible to set up indent style together with Indent width

Editor Setting

(located) atKeymap Setting in which it is possible to set up Shortcut Style The presets includeDefaultSublimeVim harmonyEmacs

Keymap Setting

(located) atExtension Setting in which it is possible to Search and install various plugins The number of plugins is very limited at the moment, but I believe that the quantity and quality will be gradually increased in the future.

Extension Setting

View Tencent Cloud Dedicated Hosting

Top right.Environments The tab lists the Tencent Cloud Dedicated Hosting Public Network IP Address and Hardware Parameters , click View my dedicated host to jump to Tencent Cloud Hosting List。

Tencent Cloud Hosting List

Clicking on the host for details reveals that it is located in Chengdu Server Room , remaining 30 days validity

Mainframe Overview

Return to Cloud Studio and continue the journey of experience.

Experience terminals

Next byCloud Studio in of Integrate terminals to explore this cloud host, You can see the color scheme also be It's more comfortable of。

Cloud hosting system is Ubuntu 16.04.4 LTS

usedf anduname command, it finds that the cloud host root directory is mounted 40G of storage space The operating system isUbuntu 16.04.4 LTS

Use the htop command to view system processes

Click on the terminal Top right. icon, You can quickly switch between terminal operating environments。 usehtop command found the cloud host to be 1 Core CPU, 1G RAM

Get root access

Since the user has not set a password, using thesu The command can be directly Get root access

View Java, Python versions

Available throughifconfig command to view the NIC information, but none of the hardware-related commands can be invoked.Java Versions are1.8.0_161Python2 Versions are2.7.12Python3 Versions are3.5.2

Experience the official demo

After experiencing the powerful Terminal, let's try running the official demo provided~

Official Demo Instructions Documentation

In the default Workspace, CODING preparesJavaPythonPHP Small examples in three languages to help users Experience the basic features of Cloud Studio

Demo code structure

Python 2 Demo

The Python 2 demo function is simple. Get the current time and IPhello.py The code is below.

#!/usr/bin/env python
# -*- coding: utf-8 -*-

import socket
import time

def get_time():
    return time.strftime('%Y-%m-%d',time.localtime(time.time()))

def get_host_ip():
        s = socket.socket(socket.AF_INET, socket.SOCK_DGRAM)
        s.connect(('', 80))
        ip = s.getsockname()[0]

    return ip       

print " hello (polite), Welcome to Cloud Studio"
print " The current time is:" + get_time()
print " yourIP be:" + get_host_ip()

go intopython directory, runpython hello.py That is all.

Python 2 Demo

Python 3 Demo

Python 3 demos are a bit more interesting: open source projects from GithubCursed Snake , which is a result ofborisuvarov Developed, based onPython 3 of Console Gluttony gamesnake.py The code is below.

# -*- coding: utf-8 -*-
Simple Snake console game for Python 3.

From https://github.com/borisuvarov/cursed_snake

Use it as introduction to curses module.

Warning: curses module available only in Unix.
On Windows use UniCurses (https://pypi.python.org/pypi/UniCurses).
UniCurses is not installed by default.


import curses  # https://docs.python.org/3/library/curses.html
import time
import random

def redraw():  # Redraws game field and it's content after every turn
    # win.erase()
    draw_food()  # Draws food on the game field
    draw_snake()  # Draws snake

def draw_menu():
    win.addstr(0,0, "Score: " + str(len(snake) - 2) + "      Press 'q' to quit", curses.color_pair(5))

def draw_snake():
        n = 0  # There can be only one head
        for pos in snake:  # Snake is the list of [y, x], so we swap them below
            if n == 0:
                win.addstr(pos[1], pos[0], "@", curses.color_pair(ex_foodcolor))  # Draws head
                win.addstr(pos[1], pos[0], "#", curses.color_pair(ex_foodcolor))  # Draws segment of the body
            n += 1
    except Exception as drawingerror:
        print(drawingerror, str(cols), str(rows))

def draw_food():
    for pos in food:
        win.addstr(pos[1], pos[0], "+", curses.color_pair(foodcolor))

def drop_food():
    x = random.randint(1, cols - 2)
    y = random.randint(1, rows - 2)
    for pos in snake:  # Do not drop food on snake
        if pos == [x, y]:

    food.append([x, y])

def move_snake():
    global snake  # List
    global grow_snake  # Boolean
    global cols, rows  # Integers

    head = snake[0]  # Head is the first element of "snake list"
    if not grow_snake:  # Remove tail if food was not eaten on this turn
    else:  # If food was eaten on this turn, we don't pop last item of list,
        grow_snake = False  # but we restore default state of grow_snake
    if direction == DIR_UP:  # Calculate the position of the head
        head = [head[0], head[1] - 1]  # We will swap x and y in draw_snake()
        if head[1] == 0:
            head[1] = rows - 2  # Snake passes through the border
    elif direction == DIR_DOWN:
        head = [head[0], head[1] + 1]
        if head[1] == rows - 1:
            head[1] = 1
    elif direction == DIR_LEFT:
        head = [head[0] - 1, head[1]]
        if head[0] == 0:
            head[0] = cols - 2
    elif direction == DIR_RIGHT:
        head = [head[0] + 1, head[1]]
        if head[0] == cols - 1:
            head[0] = 1

    snake.insert(0, head)  # Insert new head

def is_food_collision():
    for pos in food:
        if pos == snake[0]:
            global foodcolor
            global ex_foodcolor
            ex_foodcolor = foodcolor
            foodcolor = random.randint(1, 6)  # Pick random color of the next food
            return True
    return False

def game_over():
    global is_game_over
    is_game_over = True
    win.addstr(10, 20, "Game over! Your score is " + str(len(snake)) + "  Press 'q' to quit", curses.color_pair(1))

def is_suicide():  # If snake collides with itself, game is over
    for i in range(1, len(snake)):
        if snake[i] == snake[0]:
            return True
    return False

def end_game():

# Initialisation starts --------------------------------------------
DIR_UP = 0  # Snake's directions, values are not important,
DIR_RIGHT = 1  # they сan be "a", "b", "c", "d" or something else

is_game_over = False
grow_snake = False

snake = [[10, 5], [9, 5]]  # Set snake size and position
direction = DIR_RIGHT
food = []
foodcolor = 2
ex_foodcolor = 3

win = curses.initscr()  # Game field in console initialised with curses module
curses.start_color()  # Enables colors
curses.init_pair(1, curses.COLOR_CYAN, curses.COLOR_BLACK)
curses.init_pair(2, curses.COLOR_BLUE, curses.COLOR_BLACK)
curses.init_pair(3, curses.COLOR_GREEN, curses.COLOR_BLACK)
curses.init_pair(4, curses.COLOR_MAGENTA, curses.COLOR_BLACK)
curses.init_pair(5, curses.COLOR_RED, curses.COLOR_BLACK)
curses.init_pair(6, curses.COLOR_YELLOW, curses.COLOR_BLACK)
win.keypad(1)  # Enable arrow keys
win.nodelay(1)  # Do not wait for keypress
curses.curs_set(0)  # Hide cursor
curses.cbreak()  # Read keys instantaneously
curses.noecho()  # Do not print stuff when keys are pressed
rows, cols = win.getmaxyx()  # Get terminal window size

#  Initialisation ends ---------------------------------------------

#  Main loop starts ------------------------------------------------

while True:
    if is_game_over is False:
    key = win.getch()  # Returns a key, if pressed
    time.sleep(0.1)  # Speed of the game

    if key != -1:  # win.getch returns -1 if no key is pressed
        if key == curses.KEY_UP:
            if direction != DIR_DOWN:  # Snake can't go up if she goes down
                direction = DIR_UP
        elif key == curses.KEY_RIGHT:
            if direction != DIR_LEFT:
                direction = DIR_RIGHT
        elif key == curses.KEY_DOWN:
            if direction != DIR_UP:
                direction = DIR_DOWN
        elif key == curses.KEY_LEFT:
            if direction != DIR_RIGHT:
                direction = DIR_LEFT
        elif chr(key) == "q":

    if is_game_over is False:

    if is_suicide():

    if is_food_collision():
        grow_snake = True

#  Main loop ends --------------------------------------------------
Python 3 Demo

It's really playable! But it seems that there is a delay on Cloud Studio (after all, you have to interact with the server), so you may want to run it locally if you are interested haha~

PHP Demo

PHP Web Demo

A very simple one.PHP Web Demo with the Cloud Studio'sAccess URL tab use, You can come from the public network of Access is redirected to the cloud hostPHP Web Server of Listen to the port。 The prompt cannot be found herefavico.ico , the page icon does not load, and the public network passes Redirected links Access to PHP services.

Public access to PHP Server

Java Demo

The official Java Demo is an official Java Demo based on theMaven constructedSpring Boot Project.StudioDemoApplication.java The code is below.

package com.coding.studiodemo;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.web.bind.annotation.RequestMapping;  
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;

public class StudioDemoApplication {
    public String greeting(ModelMap map) {  
        String jreVersion = System.getProperty("java.specification.version");
        map.addAttribute("jreVersion", "v" + jreVersion);
        return "index";

	public static void main(String[] args) {
		SpringApplication.run(StudioDemoApplication.class, args);

configuration filepom.xml The code is as follows

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">


	<description>Demo project for Spring Boot</description>

		<relativePath/> <!-- lookup parent from repository -->





ViewMaven Versions are3.3.9 , run directlymvn spring-boot:run Start the service, because be Run for the first time, You need to wait a while to download the dependency。

Start the Maven service

After the dependency download completes, the service starts successfully and Creating an Access URL For public network access.

The service starts successfully and the Access URL is created

Finally visit the link and successfully visitJava Web Demo Page The end of the first experience with Cloud Studio~

Java Web Demo

To summarize.

Compared to traditional cloud hosting, based Container Technology ofCloud Studio more (than sth. else) Lightweight and fast Visualization IDE The add-on greatly improves development efficiency and application scenarios are more relevant. If one simply wishes to be in Pre-built environment Cloud Studio would be a good choice to run some services or do some experiments in.

but be,Free Trial version Access URLs are only valid for 1 hour (Upgrade to CODING Diamond membership is required to lift the expiry date), and Unable to access Tencent Cloud dedicated host through public IP Therefore, if you need to provide services in the public network and are not too obsessed with GUI, the cloud hosting of each company is still the first choice for development.

Reference Articles 1. Tencent Cloud 2. CODING 3. A Deeper Look at Cloud Studio Development in the Cloud | Button CODING 4. Cloud Studio | Coding.net 5. Coding WebIDE | Coding.net 6. Cloud Studio Help Documentation | Coding.net

and About Me

  • Master of Software Engineering, South China University of Technology
  • Programmer, Ukuer, Soccer Dog( ̄▽ ̄)~*
  • WeChat public number "Su Yi Bei" is updated simultaneously
WeChat public number Su Yi Bei synchronized update

1、What you dont know about the difference between padding and margin
2、Big Talk 2018 Mobile Trends No 6 Who can keep going in the second half of smartphones
3、After Japans midlife crisis theres an even bigger crisis ahead for technology
4、Farewell to Distributed Capital Vitalik to focus on ethereum development
5、Whos Whos Who

    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送