Implementing this feature proved nothing less than a monumental task. From sifting through decade old AWS documentation (like, seriously, its 2021 Amazon please update your documentation) to piecing together information from endless StackOverflow posts, in this article, I highlight the challenges I faced and the solutions I was able to come up with to get a fully asynchronous chat module + real-time data feed set up as part of a project I’m currently working on using a Django-React stack deployed on AWS.
Before we dig in, let’s briefly touch up on the above technologies:
If you’re looking at a Django-React project that you are ready to deploy, at some point, you may come across the “white screen of death” issue. After navigating to your application URL, the page loads, you see what you’d expect to see for a second, and then suddenly the screen turns white. A quick peek at DevTools will reveal that all network requests succeeded. All your content has loaded and is right there, yet all you see is a blank white screen. Frustrating, isn’t it?
Its happened to me and coming up with a workaround for this required a fair…
All Django applications come with an out-of-the-box SQLite database set up for your application. However, oftentimes, we prefer to use a different database backend that meets our requirements. In this article, we look at how we can connect a local PostgreSQL database to our Django application.
Before we proceed, we’re assuming that you have PostgreSQL set up on your machine. If you don’t have PostgreSQL set up, follow the link here to get started: https://www.postgresql.org/download/.
If all’s well, you should now have access to psql — the interactive command-line utility for accessing your PostgreSQL databases. …
This is a feature I’ve had to implement very recently for a project and it took some tinkering to finally get it working. I hope this helps anyone whose having to deal with such a use case!
→ Get Django to locate the files you want to serve.
Django by default stores files locally using the MEDIA_ROOT and MEDIA_URL settings (defined within settings.py). Hence, we’ll need to define a folder that will house the files we want to make available for download via our application. Create a new folder named media and place it in the root directory…
If you’re like me and have used Ant Design, I’m sure at some point you’ve said to yourself: “That button sure looks good but I wish I could change the default styling”. If so, let me tell you that Ant Design does allow you to apply your custom CSS as well as override existing styles with some additional effort from your end.
For your components to look the way you want, what is required is some “tweaking” of the Ant Design library files (in particular the webpack.config.js) file thats sitting inside:
Create-React-App is a handy tool since it…