Custom Code Snippets in VS Code for your Django Project

*Syntax Error*

With Visual Studio Code it's really easy to add custom code snippets. In fact, it's so easy, it would be a crime not to... so stop wasting time you could have spent bugging your team with cat videos and write your own snippet today!

*PS! If you're in a hurry you can just steal mine... I won't blame you... (Copy the code snippet at the bottom of this post)*

How to: Write your own Code Snippets!

Open User Snippets

In VS Code go to: Code>Preferences>User Snippets

Select Language

In the dropdown, select language for which you would like to write your snippets.

html.json

Once you have selected your language, a JSON file is opened. This is where you will place your custom code snippets.

Writing your own snippets

Each snippet is defined under a snippet name and has a prefix, body and description.

The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:

• $1, $2 for tab stops,

• $0 for the final cursor position,

• ${1:label}, ${2:another} for placeholders. Placeholders with the same ids are connected. ##Example: "Print to console": { "prefix": "log", "body": "console.log('$1');", "$2", "description": "Log output to console" }<hr>

❕ BONUS:

#+= Show of hands... who has ever been misled by an old comment? I'll take an educated guess and say you have... too... #🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻

BONUS:

#+= Show of hands... who has ever been misled by an old comment? I'll take an educated guess and say you have... too... #🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻🙌🏻

We might not ever get around to solve this issue completley... but one way to give you a hint of how old the comment is to datestamp your comments.

# TODO: Finish this article before publication

...But this whole article is about speeding up your workflow... not giving you more to do...

##Custom "TODO Snippet" you say? Cookie-point for you!

Using the variables $CURRENT_MONTH_NAME, $CURRENT_DATE & $CURRENT_YEAR we are able to write a custom snippet that gives you this: # TODO October 19, 2018: Try not to overuse this awesome snippet!

How to implement:

Copy-pase this snippet into your VS Code python.json snippet file: (Just replace the "#" with whatever prefix is needed for comments in your prefered language!)

"Datestamped Todo": {
	"prefix": "todo",
	"body": [
		"# TODO $CURRENT_MONTH_NAME $CURRENT_DATE, $CURRENT_YEAR: "
	]
},

<hr> ## Django Template Snippets Sometimes you just **want to get sh™t done...** I know I do... Here are some Django snippets I use to speed up my template making.

If Statement

{% if ==publication.image== %} <br>
==_== <br>
{% endif %}

Python
"Django Template If Statement": {
	"prefix": "Django If Statement",
	"body": [
		"{% if $1 %}",
		"\t$0",
		"{% endif %}",
	]
},
			

For loop

Python{% for ==pub== in ==publications== %} <br>
    ==_== <br>
{% endfor %}

Python
"Django Template For Loop": {
    "prefix": "Django For Loop",
    "body": [
        "{% for $1 in $2 %}",
        "\t$0",
        "{% enfor %}",
    ]
},

Load

{% load ==static== %}

"Django Template Load": {
    "prefix": "Django Load",
    "body": "{% load $1 %}",
},

Extends

{% extends '==base.html==' %}

"Django Template Extends": {
    "prefix": "Django extends",
    "body": "{% extends \"$1\" %}",
},

Django Block Tag

{% block ==content== %} ==_== {% endblock ==content== %}

Python"Django Template Block": {
    "prefix": "Django Block",
    "body": [
        "{% block $1 %}"
        "\t$0",
        "{% endblock $1 %}",
    ]
},

Django Regroup List

{% regroup ==publication_list== by ==published_at.year== as ==year_list== %}

Python"Django Template Regroup List": {
    "prefix": "Django Regroup List",
    "body": "{% regroup $1 by $2 as $3 %}",
},

Django Truncate Chars Filter

{{==publication.title==|truncatechars:==20==}}

Python"Django Template Filter Truncate": {
    "prefix": "Django Truncate Chars",
    "body": "{{$1|truncatechars:$2}}",
},

Django Safe Filter

{{ ==publication.content== | safe }}

Python"Django Template Filter Safe": {
    "prefix": "Django Safe",
    "body": "{{ $1 | safe }}",
},

Django Insert Image If It Exists

Python{% if ==publication.image== %}<br>
< img src="{{==publication.image==.url}}" class="==_==" />
{% endif %}

Python
"Django Template Safe Image": {
    "prefix": "Django Img If Exists",
    "body": [
        "{% if $1 %}",
        "\t<img src=\"{{$1.url}}\" class=\"$2\" />",
        "{% endif %}",
    ]
},

Django Template Set Language

Python{% language '==en==' %}
==_==
{% endlanguage %}

Python
"Django Template Language": {
    "prefix": "Django Language Specific",
    "body": [
        "{% language '$1' %}",
        "\t$0",						 
        "{% endlanguage %}",
    ]
},

Django Template With

Python{% with ==pub== = ==month.list==|first %} 
    ==_==
{% endwith %}

Python
"Django Teplate With":{
    "prefix": "Django With",
    "body": [
        "{% with $1=$2 %}",						 
        "\t$0",
        "{% endwith %}",					 
    ]
},