teleren/devto huggingface dataset:
Django shorts: #2 Environment variables
Tags: django, web, webdev
Published: 2022-10-09 09:50:20

## Why do we need to set up environment variables in Django?
As we continue to build our Django web application, we will eventually come to a realization that there is a lot of sensitive information that is stored in our settings.py file. Typical examples of this sensitive information may include API keys and passwords. Upon realizing the need to keep prying eyes from this type of information, you will think, how can I keep everything separate and safe. 

**.
.
.**


**Step 1:**

First of you head over to your terminal and install django-environ via the following command:

```
pip install django-environ
```

---

**Step 2:**

Next, be sure to import environ in your settings.py file:

```
# settings.py

import environ
```

---

**Step 3:**

We now need to define and initialize environ at the top of our settings.py file:


```
# settings.py

import environ


# Define and Initialise environment variables 

env = environ.Env()

environ.Env.read_env()
```

---

**Step 4:**

Be sure to create a .env file within the same directory as your settings.py file.

---

**Step 5:**

Declare your environment variable(s) in your .env file:


```
# .env file

THE_SECRET_KEY=g^31535r/g/wd65ognj66=xh7t05$w7q8!0_3zsl#g
```

---

**Step 6:**

Be sure to add your newly declared environment variable in settings.py, and replace the value according as follows:

```
# settings.py

SECRET_KEY = env(‘THE_SECRET_KEY’)
```

Note:* You are effectively referencing your environment variable, just within your settings.py file now.

---
**Step 7 - IMPORTANT:**

Make sure that upon pushing your code to your git repository that you create a .gitignore file and add your .env file to it. This ensures that no-one will be able to see sensitive information within your .env file.

---

**A final note…**
For those that are interested in learning how to secure their Django web application as well as how to add 2FA, feel free to check out my latest course:

[Python Django: Ultimate Web Security Checklist- 2022](https://www.udemy.com/course/python-django-ultimate-web-security-checklist-2022/?referralCode=1780ED93976EF90F18C4)
Type safety and strong typing—what are these terms?
Tags: csharp, dotnet, beginners
Published: 2022-10-09 09:41:08

"C# is a strongly typed and type safe language". This is one of the first sentences you see as a C# newbie. I did not really care about the meaning of these words when I started out and I think it mostly is because I only saw them as a features of C# and nothing to worry about.

I understood that you cannot implicitly assign some types to each other and that was just it. I also believed that type safety and strong typing have the same meaning.

But I was wrong.

The type safety feature of a programming language simply means the language only allows you to perform the operations allowed by a data type.
Take for example, you cannot perform a `IsNullOrEmpty()` check on an integer value in C# because it is only allowed on string types.


This permission can happen during runtime and/or compile time, and that is when strong (or static) typing comes in. Strong typing means the permission check will happen at compile time while weak typing means the check will happen at runtime by throwing an exception.

In our example above, the compiler will tell us `cannot convert from int to string`, making C# strongly typed and type safe.

JavaScript conversely is weakly (or dynamically) typed but type safe. An example of this is how it provides you with a well-defined way to convert a string to an integer, but only gives you an error at runtime when you are parsing the wrong string.

It is advised to use generic collections in C# because the non-generic ones are not type safe. Check the examples below:


```
using System.Collections

//Stack
Stack myStack = new();
myStack.Push("Hello");
myStack.Push(23);

//Queues
Queue myQ = new();
myQ.Enqueue("Hello");
myQ.Enqueue(23);

//ArrayList
ArrayList myAL = new();
myAL.Add("Hello");
myAL.Add(23);
myAL.Add(DateTime.Now);

```
Notice that these types allow addition of any data type in them, unlike generic ones, for example:

```
using System.Collections.Generic

❌
Stack<int> myStack = new();
myStack.Push("Hello"); // => compile time error because the only int type is allowed
myStack.Push(23);

✅
Stack<int> myStack = new();
myStack.Push(80);
myStack.Push(23);

```
How to manage state on button click?
Tags: react
Published: 2022-10-09 09:40:20

Hey @all, 

Here I am trying to build an interactive rating card. I am trying to select the rating button on first click i.e., make that particular button active and all other inactive. Everything is working fine but just can't figure it out why my button is working on second click. Here are my react components  https://codesandbox.io/s/elegant-napier-2zfcuw?file=/src/App.js


Main components here are App.js, Rating.js, RatingButton.js
Creating google app password (for django project)
Tags: django, webdev, backend, beginners
Published: 2022-10-09 09:22:20

Previously we had feature to use your gmail password directly to your project as a host password in settings.py.Last year google have updated its privacy terms and discontinued this feature.
Now we need to create a specific passwords to avail such feature,in short your host password would be of 16 chars. 

**I will tell you steps to generate an app password that you can use in django projet.**

1. Visit your [Google Account security page](https://www.google.com/settings/security).
2. In the 2-Step Verification box, click Settings (if there is no settings link, you may want to create a new one. you can skip step 3 & 4).

3. Click the tab for App-specific passwords.
4. Click Manage your application specific passwords.
5. Under the Application-specific passwords section, enter a descriptive name for the application you want to authorize, such as “”Django gmail”” then click Generate application-specific password button.
6. note down the password. for example: "krishnapass"![password][1]

**After finishing pervious steps,update your settings.py of your django project....**

```
_EMAIL_HOST = 'smtp.gmail.com'
EMAIL_HOST_USER = 'your-username@gmail.com'
EMAIL_HOST_PASSWORD = 'Application spectific password(for eg:krishnapass)'
EMAIL_PORT = 587
EMAIL_USE_TLS = True_

``
Video: Accelerate Transformer Training with Optimum Graphcore
Tags: hardware, deeplearning, machinelearning, nlp
Published: 2022-10-10 14:38:29

---
title: Video: Accelerate Transformer Training with Optimum Graphcore
published: true
date: 2022-10-09 09:12:25 UTC
tags: hardware,deeplearning,machinelearning,nlp
canonical_url: https://julsimon.medium.com/video-accelerate-transformer-training-with-optimum-graphcore-eb03d667ea22
---

In this video, I show you how to accelerate Transformer training with [Optimum Graphcore](https://github.com/huggingface/optimum-graphcore), an open-source library by Hugging Face that leverages the [Graphcore](http://graphcore.ai) AI processor.

First, I walk you through the setup of a Graphcore-enabled notebook on Paperspace. Then, I run a natural language processing job where I adapt existing Transformer training code for Optimum Graphcore, accelerating a BERT model to classify the star rating of Amazon product reviews. We also take a quick look at additional sample notebooks available on Paperspace.

{% youtube DgcJscPu1Vo %}
OmniFood-Clone
Tags: webdev, tutorial, css, html
Published: 2022-10-09 09:03:00

Hey, their fellow developers, I'm really excited about these new additions and I think you will be too! Here's the latest update on my project, which now includes two new sections:

1. Featured in Section
2. A Layout Z- Pattern (How it Works Section)

As you Can see in the Featured Section I have shown all the Publications where this Brand "OmniFood" is Presented. Here I have used a CSS filter to dim the color brightness so they look classic grey equally for a better professional view.

Then here I used some visual hierarchy and the Z-pattern layout in this design. These elements help to focus the viewer's attention on the most important information and make the content more readable

As always, if you have any questions or feedback, please don't hesitate to reach out

Here is my Codepen and Github Link for the project:
Codepen: https://lnkd.in/dG5HKSZD
GitHub: https://lnkd.in/djra_VhZ
{% codepen https://codepen.io/uuc110/pen/wvjYOWw %}
Web projects for Hacktoberfest
Tags: react, hacktoberfest, github, opensource
Published: 2022-10-09 08:56:03

For those who want to participate in this year hacktoberfest and are looking for simple web projects where you can contribute I have a few repositories on my github:

[Top three crypto](https://github.com/eduardconstantin/Top-three-crypto): A dashboard that uses an open API to retrieve the best three cryptocurrencies on the market.

[Crypto rankings](https://github.com/eduardconstantin/Crypto-Rankings): Similar to the above project but with a different UI

[Comic book button animation](https://github.com/eduardconstantin/Comic-book-button-anim): This is a project that uses framer motion for animations, trying to recreate a comic book style animation for a button

[Regenerator](https://github.com/eduardconstantin/Regenerator): This is an old project I did for fun to learn web development, I think it can expand and become a nice open source project.

Everybody is welcome to open an issue or a PR.
Check IP address on ESP32 via serial console
Published: 2022-10-09 08:49:11

Connect to ESP32 via serial console

```
screen /dev/cu.usbserial-0001 115200
```

Check IP address

```
>>> import network
>>> sta_if = network.WLAN(network.STA_IF)
>>> sta_if.ifconfig()
('192.168.0.14', '255.255.255.0', '192.168.0.1', '192.168.0.1')
```

The result represents a list that takes as follows: IP address, Subnet mask, Default gateway, DNS server address.

Reference

[4. Network basics — MicroPython 1.8.7 documentation](http://docs.micropython.org/en/v1.8.7/esp8266/esp8266/tutorial/network_basics.html)
An alternative method to view your Heroku Database tables
Tags: heroku, postres, alternatives, developer
Published: 2022-11-10 10:52:59

---
title: An alternative method to view your Heroku Database tables
published: true
date: 2022-10-09 08:46:04 UTC
tags: heroku, postres, alternatives, developer
canonical_url: https://magbanum.com/blog/an-alternative-method-to-view-your-heroku-database-tables
---

In this article, I will tell you about an alternative method to view your database from the Heroku platform. Check the tables of your Heroku Postgres Database used by your website or an application.

When I deployed my application on Heroku, I was curious about checking tables created by Django and Models. But was unable to check it as Heroku provides no specific functionality to view what's inside a database. After exploring, I found this application that helped me go through my database tables.

Following are the quick steps to get started,

## Download a small application

Firstly download the application file respective to your machine from [this link](https://github.com/sosedoff/pgweb/releases/tag/v0.11.12) and extract the zip file.

## Run the application

Run this application and this will start one localhost session at `https://localhost:8081` or any other port. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665299072771/0pQoLCRboo.png)

## Visit localhost

After visiting the respective localhost link, you will see the following page. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665299440355/cw3roJc3i.png)You will get an option to connect with your database using a standard URI, Database credentials or SSH.

## Get Database credentials

Visit your application dashboard on Heroku, go to the Resources tab and click on Heroku Postgres. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665299843338/wio-gVlF2.png)On the Datastores page, go to the Settings tab and click on View Credentials. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665300006493/XI-fW0Tlc.png)You will get the Hostname, Database, User, Port, Password, URI and Heroku CLI information. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665300312234/v3heOvwTB.png)

## Connect to Database

You can use these credentials to connect to your database. For this article, I will be using the URI method. Copy the URI from the Heroku dashboard, paste it into the **Scheme** tab and click on connect button. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665300653393/HOVZgq9hX.png)This will open your database and the tables in it. ![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1665300861531/I39TN74_D.png)You can get a lot of information about your databases such as tables, rows and table structure. Find out now yourself by following the steps above.

Thank you for reading this article. You can also subscribe to my newsletter to receive my articles straight to your inbox.

> Be better than Yesterday's you!
🚀Using HyperUI : Make Next js & Tailwind CSS website in 10 min🚀🚀
Tags: salmanghouridev, nextjs, tailwindcss, react
Published: 2022-10-09 08:23:14



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n3qzpvii1xzf77ktx0ny.png)

YouTube Tutorial Link: https://bit.ly/hyperuitailwind

Source Code Link: https://github.com/Salmanghouri/tailwind-with-nextjs-template-opensource

In this video I will Teach You how to make Next js Tailwind Css Website using Ready Components.. There are following UI Kit you can use to make website in minutes for your client....
If you want more videos like this ...

Please Like Share & Comment to boost my confident … :)
All Links:
Hyper UI Link: https://www.hyperui.dev/
Tailwind Css Cheat Sheet: https://tailwindcomponents.com/cheatsheet/
HTML to JSX Compiler: https://magic.reactjs.net/htmltojsx.htm

What is Hyper UI?
HyperUI: Free Open Source Tailwind CSS Components

What is Tailwind Css Cheat Sheet?
You use this Cheat Sheet Make your Work Earlier...

Any Query Please Comment !!
Thanks for Watching :)
Enjoy!
Today's Daily Dose of Programming Humor
Tags: jokes, dailydeveloperjokes
Published: 2022-10-09 08:00:22

---
title: "Today's Daily Dose of Programming Humor"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
published: true
tags: #jokes, #dailydeveloperjokes
---

Hi there! Here's today's Daily Developer Joke. We hope you enjoy it; it's a good one.

![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1259082460c.png)

---

For more jokes, and to submit your own joke to get featured, check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/). We're also open sourced, so feel free to view [our GitHub Profile](https://github.com/dailydeveloperjokes).

### Leave this post a ❤️ if you liked today's joke, and stay tuned for tomorrow's joke too!

_This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit._

<!--
Joke text:
___Q:___ Why do kayakers make bad programmers?

___A:___ Because they're afraid of waterfall.
 -->
Hacktoberfest 2022 with Bytebase
Tags: hacktoberfest, opensource, go, sql
Published: 2022-10-09 08:10:39

It's almost October, the holiday season is almost upon us! 🎃For us hackers, it means that the annual [Hacktoberfest](https://hacktoberfest.com/) is about to start.

This time, Bytebase is also joining Hacktoberfest and we invite everyone to join us 💙.

## What is Hacktoberfest?
Hacktoberfest = Hacker + Oktoberfest🍺. It is an open-source celebration that takes place every October. Whether you're an open-source newbie or a seasoned developer, you can find something of interest among the projects participating in Hacktoberfest and join this global community event by contributing changes!

## How to participate as a contributor

- Make sure to [register](https://hacktoberfest.com/auth/) between now and October 31;
- Raise a Pull/Merge Request in the repository of a project participating in Hacktoberfest;
-> [GitHub repos](https://github.com/topics/hacktoberfest)
-> [GitLab repos](https://gitlab.com/explore/projects/topics/Hacktoberfest)
- Project maintainers accept your Pull/Merge Requests for them to count toward your total;
- Have 4 Pull/Merge Requests accepted between October 1 and October 31 to complete Hacktoberfest🎉;

The first 40,000 participants to complete Hacktoberfest can choose one of two prizes:

- a tree planted in your name🌳;
- a Hacktoberfest 2022 t-shirt👔.

More details can be found [here](https://hacktoberfest.com/participation/#contributors).

## Bytebase at Hacktoberfest
We've curated some [good first-time issues](https://github.com/bytebase/bytebase/issues/2798) for you to get started with, make sure to check them out ;)

💡If this is your first time contributing to Bytebase, you can start with the [Bytebase source code tour walk-through](https://sourcegraph.com/github.com/bytebase/bytebase/-/blob/docs/design/sql-review-source-code-tour.snb.md). You can also refer to our [Contribution Guide](https://github.com/bytebase/bytebase#-interested-in-contributing).

If you encounter any issues, or need a helping hand, feel free to join our [Discord](https://discord.gg/6JYYBXvMDF)!
Starting a new game project
Tags: gamedev, godot
Published: 2022-10-08 23:27:06

Today I'll be starting a new project. I've written simple apps and games in the past as side projects using older, now depreciated, frameworks... but nothing too serious. Lately I've been bouncing some ideas off of my kids to see if there is anything worth pursuing. One idea that seemed to stick is a cross between Lemmings and Fallout Shelter. When I was younger, the game Lemmings was super fun and seems simple enough for a beginner project. BUT I really like the graphics style in Fallout Shelter where there are 2d characters inside stacked 3d rooms.

Lemmings:
![Lemmings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9an1i9hieaer6ppvilfn.jpg)

Fallout Shelter:
![Fallout Shelter](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hrwd5o043enh7a9gmxdl.jpg)

A cross between the two seems possible to me and a School theme might look cool. I'm thinking the school bell rings and students need to get to the school bus. Like in Lemmings some students can be turned into "blockers" or have other abilities to help their classmates get to their destination.

After poking around in Godot for a bit, I made a test scene with a 3d room, a 2d sprite and some keyboard navigation. This was enough to convince me that a game like this is possible. Maybe I'll call it "Class Dismissed" :)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7x39i3wr4jsh1afp4di.gif)
Increasing Order Search Tree
Tags: javascript, leetcode
Published: 2022-10-09 07:52:08

Given the root of a binary search tree, rearrange the tree in in-order so that the leftmost node in the tree is now the root of the tree, and every node has no left child and only one right child.

 

Example 1:


Input: root = [5,3,6,2,4,null,8,1,null,null,null,7,9]
Output: [1,null,2,null,3,null,4,null,5,null,6,null,7,null,8,null,9]

```js
/**
 * Definition for a binary tree node.
 * function TreeNode(val, left, right) {
 *     this.val = (val===undefined ? 0 : val)
 *     this.left = (left===undefined ? null : left)
 *     this.right = (right===undefined ? null : right)
 * }
 */
/**
 * @param {TreeNode} root
 * @return {TreeNode}
 */
var increasingBST = function (root) {
  let nodes = [];
  const dfs = (root) => {
    if (root === null) {
      return;
    }
    dfs(root.left);
    nodes.push(root.val);
    dfs(root.right);
  };

  dfs(root);

  let treeNode = new TreeNode(0);
  let current = treeNode;
  for (let i = 0; i < nodes.length; i++) {
    current.right = new TreeNode(nodes[i]);
    current = current.right;
  }

  return treeNode.right;
};
```
One Tab Group: Your all-in-one tab/tab group manager alternative to OneTab for Chrome
Tags: chromeextension, chrome
Published: 2022-10-09 07:11:40

---
title: One Tab Group: Your all-in-one tab/tab group manager alternative to OneTab for Chrome
published: true
description: One Tab Group is a chromium based extension that allows you to manage your tabs & tab groups in one place. One-click to aggregate all tabs & tab groups into one session.
tags: chromeextension, chrome
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bix5gzywlk568swrukxs.png
# Use a ratio of 100:42 for best results.
---

 
Does anyone feel that the `OneTab` plugin is no longer enough to meet your needs?

- Are you also suffering from opening too many tabs, but can not find the site you want to find, all Icon ~ ~
- Are you also suffering from the fact that onetab can only recover tabs, but not groups of tabs?
- Are you also tired of onetab's layout, leaving a large blank space on the right side?
- Are you also looking forward to a new plugin that can replace it !!!

---

## One Tab Group

![One Tab Group](https://www.onetab.group/preview.jpg)

I'm building a Chrome plugin called `One Tab Group` that solves some of the above problems. For those interested, check out this video

[https://www.youtube.com/watch?v=lZ65zLtk_pI](https://www.youtube.com/watch?v=lZ65zLtk_pI)

If you were familiar with `onetab`, then you will also use `One Tab Group` as well.

## Features

The following features are supported.

- ⚡️ One click button to save all tabs in the chrome window as a new session
- 🖱️ Hand pick tabs and store them as a new session in the context menu
- 🗂️ Restore tabs
  - in current window
  - in a new window
- 🔄 Sync your opened tabs in sidenav
- 🤏 Reorganize tab sessions use Drag & Drop with ease
- 🔲 Single Column View | Double Columns View | Timeline View
- 📑 Save your session as json file
- 🌛 Darkmode Support
- 🌍 i18n Support
- ⌨️ Command `K` Interface - easily explore the opened tabs & tab groups
- 🏷️ Visual Web Bookmark - Turn a link into a visual web bookmark with beautiful QRCode, you can share with others
- 🔖 Support for migrate tabs data from `OneTab` to `onetab.group`
- 🔍 Search all tabs quickly using fuzzy search

---

One Tab Group is focused on solving the problem of restoring tab groups as well.

So, have fun. One Tab Group already release on Chrome Web Store.

Here's the link: 

[Get it for Chrome](https://chrome.google.com/webstore/detail/one-tab-group/lajbajamkpmkmldodfbljkjihppdclbm?hl=en-GB&authuser=0)

[Get it for Mircosoft Edge](https://microsoftedge.microsoft.com/addons/detail/one-tab-group-tabtab-g/njmgdlgmnlinpieohfpmiipenmgilpga)

If you have any idea about it, welcome let me know

[Suggest a Change](https://github.com/one-tab-group/onetab.group/issues/new)