What I want to do
In this article, I'll set up the VSCode text editor to work with the Django framework, and Python as well. Automate what needs to be done, install what's needed, configure what's necessary. I understand that some might say something like, "What's the big deal? Just install an extension for Python and Django support and you're good to go." They might also add some syntax highlighting, which is nicer to look at.
And indeed, that's exactly what beginners and newbies should do. Don't worry about how and what to install in your editor at the beginning. The important thing is to start creating your project. And then, later, install everything as needed.
But if you're not a beginner and already have a working knowledge of Django and Python, you might want to automate some processes and make your life easier. That's what this article is for, my friend. Maybe you'll find some new and unknown extensions, who knows?
Let's start with the editor and code.
The easiest way to start is by adding syntax support for our main working tools. That is, Python, CSS, JavaScript, Django, and HTML.
For Python support, it's best to install an entire extension package that adds and configures everything needed to work with this language.
The Python extension page in the editor itself
Next, you can add a small helper extension for Django to make writing website templates faster and easier. It will simply add snippets.
The Django extension page in the editor itself
Next, we'll add a whole host of extensions for CSS, HTML, and JS. Nothing fancy: basic HTML snippets, JS snippets, support for highlighting custom classes in HTML files (defined in CSS), plus the ability to navigate to these class definitions from HTML—that's for CSS.
- https://marketplace.visualstudio.com/items?itemName=pranaygp.vscode-css-peek
- https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css
- https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion
- https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets
I also like to use tailwindcss in my projects. I'll install the extension with syntax support, highlighting, and hints for existing classes. It allows you to simply write HTML without even having to open and create CSS files. I find it very useful and helpful, although that's probably a matter of personal preference.
The TailwindCSS extension page in the editor itself
Remote Servers and Databases
But a code editor alone won't do the trick. Working with Django, you'll inevitably encounter databases. Initially, you'll work with a local SQLite3 file-based database. It's installed and configured by default in all Django projects.
This extension can be downloaded here.
The SQLite3 extension page in the editor itself
But once your project grows and is hosted on a server, you'll need a different database browser and editor that can connect to a remote server and perform all necessary operations directly from the editor. This extension is MySQL Client.
The MySQL extension page in the editor itself
This extension is great because it lets you work not only with MySQL but also with other databases, such as PostgreSQL, MarinaDB, and Redis.
Okay, so now we can work with remote databases for our apps and websites directly from the editor. But the website still needs to be deployed to the server, and to do that, you'll need to log into the server and open a terminal. To access the server, you'll either need to use the hosting platform's built-in solutions or use terminal emulators and log in through them.
I have nothing against them, but I'd prefer to keep the entire development process in a single application. Therefore, I maintain a connection to the server through an SSH client installed as a VSCode extension. And I use this:
The SSH Client extension page in the editor itself
This, I think, is all you need for working on a personal project or maintaining an existing Django site. That is, connecting directly to the databases and the server itself.
Conclusion
Today we configured and enabled the most essential extensions for developing and maintaining Django websites. These ranged from basic syntax highlighting and extensions for working with the relevant programming languages.
We also covered working with databases directly from the editor. Specifically, with the database at the very beginning of a project's lifecycle, SQLite3, and databases for projects deployed on servers, such as MySQL, PostgreSQL, MarinaDB, and Redis.
That's all I've covered regarding the necessary extensions and setting up the text editor.
