DEV Community

Discussion on: How I set up VSCode for productivity? [Checklist]

Collapse
 
chachan profile image
Cherny

Love the theme, I've been looking for one like this for ages. For productivity I'm also using these:

  • Code Time

    GitHub logo swdotcom / swdc-vscode

    Time-tracking plugin for Visual Studio Code


    Code Time
     


    Code Time is an open source plugin for automatic programming metrics and time-tracking


    Marketplace Installs Rating Live Share enabled


    Getting started

    1. Create your web account

    Code Time for VS Code login prompt

    The Code Time web app has data visualizations and settings you can customize, such as your work hours and rates per project for advanced time tracking. You can also connect Google Calendar to visualize your Code Time vs. meetings in a single calendar.

    You can connect multiple code editors on multiple devices using the same email account.

    2. Track your progress during the day

    Code Time for VS Code status bar

    Your status bar shows you in real-time how many hours and minutes you code each day. A rocket will appear if your code time exceeds your daily average on this day of the week.

    3. Check out your coding activity

    To see an overview of your coding activity and project metrics, open the Code Time panel by clicking on the Code Time icon in…

  • carbon-now-sh

    GitHub logo carbon-app / carbon

    🎨 Create and share beautiful images of your source code

    maintained with Ranger All Contributors MIT License FOSSA Status

    Open Collective sponsors Open Collective backers Open Collective sponsors

    Translations

    Introduction

    You know all of those code screenshots you see on Twitter? Though the code's usually impressive, we saw room for improvement in the aesthetic department. Carbon makes it easy to create and share beautiful images of your source code. So what are you waiting for? Go impress all of your followers with your newfound design prowess.

    Carbon example

    Features

    • Customization. Customize things like your image's syntax theme, window style, and more
    • Share quickly. Save your image or a link with one click
    • Import from GitHub gist. Simply append a GitHub gist id to the url

    Usage

    Import

    There are a few different ways to import code into Carbon:

    • Drop a file onto the editor
    • Append a GitHub gist id to the url (e.g. carbon.now.sh/GIST_ID_HERE)
    • Paste your code directly

    Customization

    Once you've got…



  • GitLens



    GitHub logo
    eamodio / vscode-gitlens



    Supercharge the Git capabilities built into Visual Studio Code — Visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more





    GitLens Logo

    GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.

    Support GitLens

    Sponsored by


    Discuss, review, and share code with your team in VS Code. Links discussions about code to your code. Integrates w/ Slack, Jira, Trello, and Live Share. Try it free

    While GitLens is generously offered to everyone free of charge, if you find it useful, please consider supporting it.

    Also please write a review, star me on GitHub, and follow me on Twitter

    What's new in GitLens 10

    • Adds all-new iconography to better match VS Code's new visual style
    • Adds an all-new…
  • Indenticator



    GitHub logo
    SirTori / indenticator



    VS Code Extension: Highlights the current indent depth of the cursor




    Build Status

    Indenticator

    Visually highlights the current indent depth.

    This extension can be used by itself, but it's recommended to use it alongside the builtin indent guides.

    Changes in Visual Studio Code 1.23.0:
    With Version 1.23.0 VS Code introduced a new builtin active indent guide. For an explanation of differences and tips regarding the new feature and this extension please see remarks section

    Indenticator demonstration
    Example using default settings

    Feature Highlights

    • Peeking around the current indent block: Optionally a hover can be added on the current indent marker to peek before and/or after the current indent block.
      To activate set indenticator.showHover to true

      Indenticator demonstration
      Example has indenticator.hover.peekBack & indenticator.hover.peekForward set to 1
    • Highlighting the the indent guide for the contained block: Optionally a second indent highlight can be configured to highlight the block contained by the current cursor position
      To activate set indenticator.inner.showHighlight to true

      Indenticator demonstration
      Example has indenticator.inner.color.dark set to #ff0000
    • Language

Collapse
 
whizzzoe profile image
Zoe Chew

Hey 👋 Cherny! Thanks so much for your generous share! All of them are really helpful and I can't wait to try 'em. Happy coding! 😊