Vscode: Panduan untuk Tampilan Bersih dan Minimalis

    Saya akan menunjukkan beberapa settings yang default harus saya pakai dalam menggunakan vscode.

    Irsyad A. Panjaitan

    4 min read·24 Oct 2022

    Vscode: Panduan untuk Tampilan Bersih dan Minimalis

    Karena sewaktu saya upload video tentang bagaimana pengaturan yang saya pakai dalam menggunakan phpstorm. Dan banyak yang minta juga tentang vscode, sehingga saya juga berfikir untuk membuat nya.

    Oia, disini saya tidak membahas tentang extension, karena jika mengenai extension itu bisa dilihat disini, kemudian jika mau nonton secara action, bisa langsung di ya.

    No defaults

    Berikut ini adalah pengaturan untuk menghilangkan semua default yang diberikan vscode seperti preview, multi cursor, trailing whitespace dll.

    "editor.copyWithSyntaxHighlighting": false,
    "diffEditor.ignoreTrimWhitespace": false,
    "editor.emptySelectionClipboard": false,
    "workbench.editor.enablePreview": false,
    "window.newWindowDimensions": "inherit",
    "editor.multiCursorModifier": "ctrlCmd",
    "files.trimTrailingWhitespace": true,
    "diffEditor.renderSideBySide": false,
    "editor.snippetSuggestions": "top",
    "editor.detectIndentation": false,
    "window.nativeFullScreen": false,
    "files.insertFinalNewline": true,
    "files.trimFinalNewlines": true,
    

    Give a breath

    Saya tidak pernah menggunakan aktivitas bar untuk install extension dan sebagainya, saya lebih memilih untuk menggunakan shortcut dari pada harus klik satu persatu. Untuk folding dan minimap juga saya tidak pakai, sehingga saya akan hilangkan juga.

    "workbench.activityBar.visible": false,
    "workbench.statusBar.visible": false,
    "workbench.editor.showTabs": false,
    "editor.renderIndentGuides": false,
    "editor.minimap.enabled": false,
    "editor.lineNumbers": "off",
    

    Selanjutnya saya juga tidak suka dengan suggestion noise yang dibawa vscode by default. Sehingga saya akan hilangkan itu semua dengan key ini.

    Noise

    Kita ingin vscode ini benar-benar bersih, maka setting dibawah akan menjawab pertanyaan Anda selama ini.

    "breadcrumbs.enabled": false,
    "scm.diffDecorations": "none",
    "editor.hover.enabled": false,
    "editor.matchBrackets": "never",
    "workbench.tips.enabled": false,
    "editor.colorDecorators": false,
    "git.decorations.enabled": false,
    "workbench.startupEditor": "none",
    "editor.lightbulb.enabled": false,
    "editor.selectionHighlight": false,
    "editor.overviewRulerBorder": false,
    "editor.renderLineHighlight": "none",
    "editor.occurrencesHighlight": false,
    "problems.decorations.enabled": false,
    "editor.renderControlCharacters": false,
    "editor.hideCursorInOverviewRuler": true,
    "editor.gotoLocation.multipleReferences": "goto",
    "editor.gotoLocation.multipleDefinitions": "goto",
    "editor.gotoLocation.multipleDeclarations": "goto",
    "workbench.editor.enablePreviewFromQuickOpen": false,
    "editor.gotoLocation.multipleImplementations": "goto",
    "editor.gotoLocation.multipleTypeDefinitions": "goto",
    

    Saya cuma bisa bilang, jika Anda tidak suka dengan peraturan ini, jangan digunakan. Karena ini lumayan extreme juga.

    Keyboard Shortcut

    Karena unfold dan fold sudah dimatikan dari setting tadi, maka kita bisa menggunakan shortcut untuk itu.

    // macOS
    {
        "key": "shift+cmd+[",
        "command": "editor.fold",
        "when": "editorFocus"
    },
    {
        "key": "shift+cmd+]",
        "command": "editor.unfold",
        "when": "editorFocus"
    },
    
    // Windows
    {
        "key": "shift+ctrl+[",
        "command": "editor.fold",
        "when": "editorFocus"
    },
    {
        "key": "shift+ctrl+]",
        "command": "editor.unfold",
        "when": "editorFocus"
    },
    

    Kemudian untuk menduplikasi line dan join line, saya biasa menggunakan cmd+l dan cmd+j.

    // macOS
    {
        "key": "cmd+l",
        "command": "editor.action.copyLinesDownAction",
        "when": "editorTextFocus"
    },
    {
        "key": "cmd+j",
        "command": "editor.action.joinLines",
        "when": "editorTextFocus"
    },
    
    // Windows
    {
        "key": "ctrl+l",
        "command": "editor.action.copyLinesDownAction",
        "when": "editorTextFocus"
    },
    {
        "key": "ctrl+j",
        "command": "editor.action.joinLines",
        "when": "editorTextFocus"
    },
    

    Untuk keyboard shortcut dan full setting yang saya pakai bisa dilihat di github ya. Jika kalian bukan pengguna vscode, entah itu phpstorm, saya juga sudah memperlihatkan settings nya disini, untuk youtube nya juga ada dan bisa dilihat disini. Semoga bermanfaat, saya akan melihat Anda lagi di artikel yang akan datang.

    Karteil
    Destinasi Utama Belajar Online dengan Format Tulisan yang Elegan
    Kunjungi Sekarang

    Irsyad A. Panjaitan

    Let's start living like no one can help us in any event, so that when we are helped in certain times, it becomes a plus in itself.

    Follow me on
    Support me
    SaweriaGithub

    Newsletter

    Bergabunglah dengan 23.000+ lainnya dan jangan pernah ketinggalan screencast, tips, tutorial, dan lainnya.