teleren/devto huggingface dataset:
Django Developer Roadmap 2022- Codexashish
Tags: django, python, programming, tutorial
Published: 2022-05-15 07:56:51

Django is a free, open-source, and high-level python web framework that helps you to design websites and apps that enable rapid development of the secure and maintainable design.  It utilizes the principles of MVT(Model View Templates) design and its main aim is to make development easy and secure. 

As we know, Python is becoming more popular day by day, and Django has become a framework of choice for many Python Companies. Django enables users to focus on developing components that are needed for their app or website rather than focusing on already developed components.

## Features of Django:

- Secure
- Complete
- Versatile
- Scalable
- Maintainable
- Portable


## Applications of Django:

- Building cross-platform applications
- Scalable web applications
- Applications with multiple user roles
- Building cost-efficient MVP
- Building Content Management Systems (CMS)
- Building SaaS & Enterprise applications
- Secure E-commerce applications
- Financial platforms
- Social networking and bookmarking sites

## Why Django Framework:
Built-in Features and Models: Django has already built-in features and models which means you connect your building blocks together rather than focusing to make it from the ground up.
Ridiculously fast: Django Framework was designed to help developers take applications from concept to completion as quickly as possible.

1. Fully loaded
2. Reassuringly secure
3. Exceedingly scalable
4. Incredibly versatile

## Complete Django Developer Roadmap

## Step.1 Basic of Django

- Introduction to Django
- Django Installation
- Python Installation
- Features of Django
- Applications of Django
- Why Django?
- Django vs Laravel
- Django Basic Commands
- Apache Configuration
- Virtual Environment Setup

## Step.2 Introduction to Django

- Create First Project
- Create First App
- Django Admin Interface
- Django MVT Design pattern
- MVT vs MVC Design pattern
- Django Project URLs
- Django App URLs
- Django View
- Django Model
- Django Forms(forms.py)
- Django Templates


## Step.3 Django Templates Concepts

- Django Variables
- Django Tags
- Django If Else
- Django For Loop
- Django Comment
- Django Cycle
- Django Extends
- Django Include
- Django Filter



## Step.4 Django Main Concepts

- Django URL Mapping
- ModelForms
- Static Files Handling
- File Upload
- Image Handling
- Form Validation


## Step.5 Django Other Concepts

- Database Connectivity
- Database Migrations
- Django Middleware
- Request and Response
- Django Exceptions
- Django Session
- Django Cookie



## Step.6 Django Intermediate Concepts

- Django CSV Output
- Django Caching
- Django PDF Output
- Django and Bootstrap
- Admin Customization
- Deploy on Github
- Django Mail Setup
- Django Default CRUD

**CRUD Application**

- Add
- Edit
- Delete
- Update
- Django Redirects

Django on_delete
Django Class Based Generic Views
Django UserCreationForm

## 
[Click Here to read more](https://www.codexashish.com/2022/04/django-developer-roadmap-for-beginners.html)

**Thankyou 
Codexashish**
PowerWeChat V2 - 微信SDK
Tags: go, wechat, 微信, sdk
Published: 2022-05-15 07:49:12

## 产品介绍

PowerWechat是一款全覆盖微信开发接口，基于Golang的开源项目。您只需安装一次Power WeChat SDK，就可以对接企业微信，小程序，公众号，支付等，微信的开发功能接口。同时我们提供了丰富的文档教程和辅助工具，帮助您轻松使用微信的接口功能。


## 快速上手

```go
go get -u github.com/ArtisanCloud/PowerWeChat/v2
```

示范：初始化实例对象，调用小程序的授权登陆接口
```go

import (  
    "github.com/ArtisanCloud/PowerWeChat/v2/src/miniProgram"
    "os"
)

// 1. 初始化小程序应用实例
app, err := miniProgram.NewMiniProgram(&miniProgram.UserConfig{    
    AppID:  os.Getenv("miniprogram_app_id"), // 小程序、公众号或者企业微信的appid
    Secret: os.Getenv("miniprogram_secret"), // 商户号 appID
    HttpDebug: true,    
    Debug:     false,
  })

// 2. 调用小程序的授权登陆接口
var code string = "CODE" // 前端小程序登录时，从微信获取的
coders, err := app.Auth.Session(code)
// 查看获取强类型对象的属性
// 请参考官方文档的返回值
printf(rs.OpenID)
printf(rs.SessionKey)
printf(rs.UnionID)
```

更多实例接口，请打开 https://powerwechat.artisan-cloud.com/zh/start/

## 产品概述

### 核心产品

[PowerWeChat SDK](https://powerwechat.artisan-cloud.com/ "PowerWeChat SDK")  ：是核心的SDK产品，安装后即可开箱即用。 在github上，长期维护的开源项目，可以提Issue在讨论版块。也可以在ArtisanCloud官网上，扫企业微信讨论群，方便用户提问，给宝贵的意见。

### 辅助产品

[PowerWeChat Document](https://powerwechat.artisan-cloud.com/zh/start/ "PowerWeChat Document") ：全面的接口文档，方便用户查找，使用我们开发的sdk功能

[PowerWeChat Tutorial](https://github.com/ArtisanCloud/power-wechat-tutorial "PowerWeChat Tutorial")  ：独立的golang项目，提供完整的web接口，让开发者方便调试PowerWeChat 接口实例

![PowerWeChat 微信SDK 介绍](https://cdn.learnku.com/uploads/images/202205/30/88651/hMUBEqr9ml.jpg!large)


PowerWeChat 配置中心客户端/SAAS：如果您有多个微信的开发环境，或者多个应用，可以使用这个配置中心来方便切换账号（此应用暂时内部使用，如需体验，可以联系我们）

![](https://cdn.learnku.com/uploads/images/202204/23/88651/Waj7qGu2kl.png!large)

# 产品诞生背景

 团队也是很多同学一样，从PHP转向Golang，具体为什么，有什么好处，就不用我这里多介绍了吧。 但是现在因为微信的生态做私域化管理是得天独厚，所以我们公司也开发了蛮多企业微信的功能。只是在转型golang的过程中，没有找到像 （PHP语言）这样好用的sdk。所以我们就自己想为golang的同学们做一点贡献。产品会长期维护，迭代，希望同学们有兴趣在使用的过程中，多给意见。

# 产品特性

-   简易上手，安装一次，全覆盖微信功能接口

-   开源项目，丰富的文档内容，长期维护

-   新增群机器接口和文档

-   Golang特性，强类型覆盖

-   完整的测试项目，支持web API测试

# 相关资源

## [阅览教程文档](https://powerwechat.artisan-cloud.com/zh/start/ "阅览教程文档")

## [Github开源代码](https://github.com/ArtisanCloud/PowerWeChat "Github开源代码")

![PowerWeChat 微信SDK 介绍](https://cdn.learnku.com/uploads/images/202205/30/88651/t1Ys16xBLx.jpg!large)
How to Install React.js On Windows- Codexashish
Tags: react, javascript, programming, tutorial
Published: 2022-05-15 07:46:45

In this article, we are going to see How to Install ReactJS in Windows or How to Install React in Our System. So without wasting any time let's start our article:

React JS is one of the most popular JavaSript Libraries useful in building user interfaces and It is an open-source component based on the front-end. With the help of ReactJS,  we can create an awesome application and dynamic application because ReactJS requires less coding and offer more functionality. Nowadays ReactJS becoming more popular among  MNC companies because of its feature and functionality. 

## Features of React Js:
Reusable Components:
Debugging
JSX
One-way Data Binding
Virtual DOM
Simplicity
Performance


## Installation of Reactjs on Windows:

## Step.1 Download Node.js Installer
You can download the Node.js installer from google by searching "nodejs" on google. Click on the first official website "nodejs.org" and you will see the LTS version and the current version of Node.js. The LTS version is the best and it is a recommended version because it has been created not in process. So you can simply click on the LTS version to download Node.js. Or you can CLICK HERE to go on the download page. When you click on the LTS version to download, it will automatically start downloading.


## Step.2 Install Node.js Installer
Once the Node.js download is completed, Now find the downloaded installer file and double click on that to install it on your system.

Accept the Terms and Conditions, and click on the ok button. After installing Node.js on your system, it will show you a congratulation message.

Now We have successfully installed Node.js Installer in our system.

## Step.3 Open CMD & Check Node.js Version
After installing Node.js on your system, you will have to first confirm whether Node.js has been installed or not. So type the below command in Command Prompt(CMD) and hit the enter 

**button:**
_node -v_

Now you can see that we have successfully installed node version "v16.14.2" on my system. The version of NodeJS might be different in your system because when I am writing In this article, the Node "v16.14.2" LTS version is available. NPM is automatically installed on your system after installing NodeJS on your system.

## Step.4 Install ReactJS Globally
Once Node has been installed on your system, Just copy the below code and paste it into CMD and hit the enter button. This command will install ReactJS on your system.


_**npm install -g create-react-app**_
Remember one thing: You can run this command in any folder or drive. It is the environment of ReactJS. So we have successfully installed ReactJS in our system. 

## 
[Click Here to read more](https://www.codexashish.com/2022/04/how-to-install-reactjs-on-windows.html)

**Thankyou 
Codexashish**
Jobilist: Side project to product
Tags: showdev, design, javascript, webdev
Published: 2022-05-15 07:44:18

**Hello everyone👋**

We published our side project public a few days ago after seeing some issues on job boards. We got a lot of positive feedback on it, so we're going to turn it into a side business.

Website Link : [https://jobilist.com](https://jobilist.com)
GitHub: [https://github.com/jobilist/jobilist](https://github.com/jobilist/jobilist)
ProductHunt: [https://www.producthunt.com/posts/jobilist](https://www.producthunt.com/posts/jobilist)

**What is Jobilist:**
It is simple and straightforward job board for both job seekers and employers. It is affordable, beautiful and opensource.

**How it started**
We were looking for a job and visited a number of job boards, but we noticed that they were all bulky and displayed useless information, were spammed with advertisements, and so on. So we decided to build a basic and effective job board.
And we launched it a few days ago in the community, and we've gotten a lot of positive feedback in the last few days; today, we have around **1000+ daily visitors** and **50+ active job** postings on our job board. After seeing all of this, we decided to transform this project into a product at a cheap price, as the prices on other job boards are expensive.

Thank you!
How To Debug Any React App in Seconds
Tags: javascript, react, vscode, webdev
Published: 2022-05-15 07:01:41

It amazes me how little is known about debugging in the JavaScript world. Everyone prints to the console, even though debugging is so easy and literally only takes seconds to get started.

To prove my point, I recorded a short video where I created a new React app from scratch and debugged it in VSCode in less than 3 minutes. By the way, this works with any JavaScript app, not just React.

{% embed https://vimeo.com/709988945 %}

In the videos I use `npx create-chrome-debugger` ([npm package](https://www.npmjs.com/package/create-chrome-debugger)) to create a Chrome Debugger shortcut which starts Chrome with remote debugging mode. If you are interested in the details behind that, check out my [other article](https://dev.to/zirkelc/debug-a-react-app-in-vscode-21ga) I wrote awhile ago.
Adding Markdown plugins in Remix
Tags: react, markdown
Published: 2022-05-15 06:38:15

Now that we have our [Remix Markdown powered website](https://daily-dev-tips.com/posts/remix-markdown-overview-page/) up and running let's explore how we can enhance it a bit by adding some cool Markdown plugins.

For this article, we'll add the table of contents Rehype plugin.

## Installing the Rehype plugin

We have to start by adding the plugin to our project.
To use the table of contents plugin, we also need to install the slug and auto-link headings plugins as it relies on these.

```bash
npm i rehype-autolink-headings rehype-to rehype-slug
```

With these installed, we have to register them in Remix. Luckily Remix comes prepared with a `remix.config.js` file.

We can add an `mdx` section in this file and load our plugins.

```js
module.exports = {
  // Existing lines,
  mdx: async (filename) => {
    const [rehypeSlug, rehypeAutolinkHeadings, rehypeToc] = await Promise.all([
      import('rehype-slug').then((mod) => mod.default),
      import('rehype-autolink-headings').then((mod) => mod.default),
      import('rehype-toc').then((mod) => mod.default),
    ]);
    return {
      rehypePlugins: [rehypeSlug, rehypeAutolinkHeadings, rehypeToc],
    };
  },
};
```

Now that we have loaded all three plugins, it will already work! No need to add anything else to our markdown.
We can try it out by running outcode and see what happens.

![Remix TOC Rehype plugin](https://cdn.hashnode.com/res/hashnode/image/upload/v1651734761667/HC3aoqgw5.gif)

You can also find the complete code on [GitHub](https://github.com/rebelchris/remix-starter/tree/markdown-plugin).

### Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on [Facebook](https://www.facebook.com/DailyDevTipsBlog) or [Twitter](https://twitter.com/DailyDevTips1)
Springboot annotation @Cacheable custom file set key to set expiration time and configure it in the configuration
Tags: java, redis, spring, cach
Published: 2022-05-15 06:23:26

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gywd0yiu0zwzmw3ayzzf.png)
The configuration of the Springboot RedisCacheManager class specifies the expiration time of the key and configures it in the configuration file
**purpose and effect**

  RedisCache is configured in springBoot. When the @Cacheable annotation is used, the default is redisCache. By setting the expiration time of different keys in the configuration file, the effect of customizing the key expiration time can be achieved.
**plan**
step1

Create a new Map class to store the key to be set

```java
@ConfigurationProperties
public class Properties {
 
 private final Map<String, Duration> initCaches = Maps.newHashMap();
 
 public Map<String, Duration> getInitCaches() {
 return initCaches;
 }
}
```
step 2

Write the cacheManager in the redis configuration class and put the map set into it
```java
@Autowired
private Properties properties;
 
@Bean
public CacheManager cacheManager(RedisConnectionFactory connectionFactory) {
    RedisCacheConfiguration defaultCacheConfig = RedisCacheConfiguration.defaultCacheConfig()
            .entryTtl(Duration.ofMinutes(10)).disableCachingNullValues();
 
    RedisCacheWriter redisCacheWriter = RedisCacheWriter.nonLockingRedisCacheWriter(connectionFactory);
 
    ImmutableSet.Builder<String> cacheNames = ImmutableSet.builder();
    ImmutableMap.Builder<String, RedisCacheConfiguration> cacheConfig = ImmutableMap.builder();
    for (Map.Entry<String, Duration> entry : properties.getInitCaches().entrySet()) {
        cacheNames.add(entry.getKey());
        cacheConfig.put(entry.getKey(), defaultCacheConfig.entryTtl(entry.getValue()));
    }
 
    return RedisCacheManager.builder(redisCacheWriter)
            .cacheDefaults(defaultCacheConfig)
            .initialCacheNames(cacheNames.build())
            .withInitialCacheConfigurations(cacheConfig.build())
            .build();
}
```
step3

By configuring the expiration time of the relevant key in the Springboot yml file, you can specify the expiration time of the value of @Cacheable
```java
//Fake code
@Cacheable(cacheNames = "fooboo", key = "#xxx", unless = "#result == null")
public void fooboo(String xxx){}
```
set in the applicaion.yml file

```bash
initCaches:
  fooboo: 10m
  fooboo1: 1h
```
Then the value of fooboo in the redis cache expires in 10 minutes, and the value of fooboo1 expires in 1 hour
interesting output buffer question!
Published: 2022-05-15 05:49:30

> to be update, this is a note for me.

From jyy,I get a very interesting problem.

Sence like this,here are some code:

```c
#include <stdio.h>
#include <unistd.h>
#include <sys/wait.h>

int main(int argc, char *argv[]) {
  int n = 2;
  for (int i = 0; i < n; i++) {
    fork();
    printf("Hello\n");
  }
  for (int i = 0; i < n; i++) {
    wait(NULL);
  }
}
```

if we run this programe, we can get this result:

```c
//gcc fork-printf.c && ./a.out
Hello
Hello
Hello
Hello
Hello
Hello
```

there has six 'hello'

but when we use the pipe command,like this:

```c
//gcc fork-printf.c && ./a.out | cat
Hello
Hello
Hello
Hello
Hello
Hello
Hello
Hello
```

we will get eight 'hello'.

## why

In linux, when we use stdout:

for termianl: linux use `line buffer`, if meet character `\n`, linux use system calling to output all buffer.

for pipe/file: linux use `full buffer`, when the size of buffer is up to 4096B, (except that we call `fflush(stdout)`).

for conition Ⅰ，use line buffer, directly output; otherwise, for condition Ⅱ, use full buffer.
Membuat Desktop Notifikasi di Laravel 9
Tags: laravel, tutorial
Published: 2022-05-15 05:22:52

Selamat siang teman-teman pada hari ini aku mempelajari cara membuat desktop notifikasi di laravel 9 dan artikelnya sudah aku tulis di platform yang sedang aku kembangkan, jika teman-teman penasaran ingin membaca artikelnya silahkan langsung mampir ke sini ya

[Tutorial Membuat Desktop Notifikasi pada Laravel](https://diskusikoding.com/tutorial-desktop-notifikasi-laravel)
I was tired of making banners for my blogs, so I automated it
Tags: python, showdev
Published: 2022-05-15 05:19:21

I'm a very lazy person, and always procrastinate on the smallest of things - opening the image editor, and making a good blog banner would always be the "extra" thing I had to do every time I wrote something. So, I made a script that generates them for me in milliseconds!

As Bill Gates says, 
> always choose a lazy person to do a difficult job because he will find an easy way to do it

The output is fully customizable, as it is 100% generated from code. You can change some values here and there, and boom! Generated. I ran it through all the posts of my [blog](https://blog.dhravya.dev) and it quickly replaced many of the blog posts for me.

Check out the code [Here](https://github.com/Dhravya/blog-banner-generator) (And ⭐ the post if you liked it!)

{% github https://github.com/Dhravya/blog-banner-generator %}
Python IN Browser
Tags: webdev, programming, python, html
Published: 2022-05-15 04:49:50


## What is PyScript?

Python in the browser! PyScript is a framework that allows users to create rich Python applications in the browser using HTML's interface and the power of Pyodide, WASM, and modern web technologies. The PyScript framework provides users at every experience level with access to an expressive, easy-to-learn programming language with countless applications.




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

Output:


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


## Installation of PyScript:

Just Kidding! There is no installation for pyscript. Just add these commands to your html page.


```

<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>

<py-script>
	print("Hello World!!!")#Your Python Code
</py-script>

```
Note Py-Script is still in Alpha Version.
React-Native Top Tips
Published: 2022-05-15 04:37:42

Hi there !!

I am back with a new  Blog. So this time I will cover some interesting tips about React-Native which is a framework of JavaScript.
So let's go with 🐱 Suga this time :

<img width="100%" style="width:100%" src="https://media.giphy.com/media/U8B7w1P2Y8m2QcaUjc/giphy.gif">

**React-Native Top Tips :**

Before moving further, let's first discuss what React-Native is ? And what is its use ?

**React-Native :** 

React Native is an open-source UI software framework created by Meta Platforms, Inc. It is used to develop applications for Android, iOS, Web, Windows etc. by enabling developers to use the React framework along with native platform capabilities.

**Top Tips :**


**Don’t go with Expo :** I know it's not wise to say 'Don't use Expo'. But this is the actual reality. Starting with Expo is good, but stick to it, not. Almost all tech giants don't go with Expo as it's not that much capable to handle large projects. Also, community packages also very less.

**Remove all logs from your release builds :** I think in this world, there is no such developer exist who don't use console.log() for debugging. Also,  it's very powerful tool but at the same time  if one forget to remove console while packaging or releasing App  then it will slow down our App.

**Use flex :**  If one want's that our App works efficiently, then one must rely on **flex**  instead of excessively using 
**Height and Width using Dimensions**. Using Dimension is good as it makes our App responsive but at the same time dependent on it is very painful as it will decrease the efficiency of App as every time it used it calculate the size of whole screen and apply height and width according to our selection which increase memory usage and thus efficiency decreases.

**Reuse Styles :** Reusing styles is a good practice in React-Native and reduce the repetitive code lines. For example, in every screen we are giving some style to Starting View. So in every screen instead of typing styles of that View again and again one should create a common style JavaScript file and use it everywhere we needed. We can also make different file for Colors, font Size, Card Style which will be reused in the entire App. 

**Use ternary operators concisely :** 
Writing color = error ? ‘red’: ‘gray’ is short and sweet.
Writing color = error ? (id === ID) ? ‘red’ : ‘black’ : ‘gray’ is not. 
Ternary operators can help reduce the number of lines in your code, but never nest them because the logic becomes difficult to read.

**React-Native Doctor :** react-native doctor (available as a part of React Native 0.62) is an extremely useful command to help us to  fix problems with your development environment.

**Style Overriding  :** Style Overriding is my one of the favourite tip. In this, one can override the  style without changing the element in StyleSheet. Below is the syntax of it.

```
<View style={[styles.container , {backgroundColor : "purple"}]}>  
....
</View>
```

So that's it for today's blog. I will come up with another interesting blog with BTS 🧡 .