teleren/devto huggingface dataset:
First step toward becoming a Linux Wizard.
Tags: linux
Published: 2022-05-15 04:36:12

### To become a  Linux Wizard you must conquer Command Line Interface, 
**Part 1**
#### [Watch Video](https://youtu.be/Juo_0lpBMPY) 
#### Start with, what is a CLI? 

- It is a user interface, which doesn't have pretty graphics.
- We'll use the commands to mess around.
- Let's say if you want to open a folder on your PC, we'll be using commands for that, don't freak out, its easy than it seems just bear with me,

- By the way, CLI uses BASH as a programming language.

### CLI


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c24gzbq7g676usq8vijj.png)
- here, **haris** is PC admin name 
- **cosmos** is name of my PC
- **~** is representing **Home** directory
- **$** means we're in the system shell, and ready to type commands


### Understand Directories and their Path
- All folders are like Tree Hierarchy, starting from Root Directory,


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


### Basic Commands
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uq430whdppyc9v62w161.png)
- `pwd ` present working directory
- `ls`       check the content of the directory
- `cd`    change directory
- `cd..`   change directory to previous  directory
- `cd../..`change directory to previous two times
- `cd~`  change directory to Home Directory
- flags are arguments/options
- ` ls -a` to list all the hidden files
- `ls -l`  show detailed versions of files
- `ls -la` show detailed version of all hidden files 
- `clear` clear the terminal (ctrl+l)
- `.` current directory
- `..` parent Directory
- `~`home Directory
- `-` previous Directory
- `mkdir` make a directory
- ` touch` Create a new file
- ` file` give info about file
- `gedit` edit file
- `cat` view content of a file, concatenate files
- ` history`displays  history of commands that were executed
- `uparrow` display previous commands
- `ctrl + r` reverse search
- ` ctrl + c`exit 
- **Autocomplete** - type first letter of the directory then press `tab` 
- ` cp ` copy files 
- `mv` move files 
- `rm` remove files
- ` mkdir -p` make a directory in the subdirectory
- `rm -r` remove recursively 
- `rm -rv` remove recursively and display removed directory
- `find ~ -name` find a file in home directory

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tpjc8ztvl4xkvu1vpv6q.png)
or find it only with file type or only with file name 

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c4nqoxxgr19xxwqbcelj.png)
- `find ~ -type d -name` find folder
- ` man` find the manual of any command
- `whatis` tells about command

*Now you are ready to become a Linux Wizard,
See you in Part 2*
Implementing dark and light mode
Published: 2022-05-15 04:27:32

Websites with options to switch to a "dark" or "light" mode have become a common sight these days. Offering the web user a choice such as that could help an app or website gain more traffic all because it's accessibility to people who may have vision concerns. In this blog I will briefly go over how to incorporate this function into your development! 

## Step 1
    
An important step is choosing a color palette that is pleasing to the eye and easy to navigate. Using a color palette generator such as [MyColor](https://mycolor.space/?hex=%23845EC2&sub=1) can help choose the best complimenting palettes 

## Step 2
   Once your light and dark palettes have been  chosen, it's to add some HTML for your toggle buttons. For my project I knew I wanted to add some fancy toggle buttons, but seeing as this was my first official project I relied on an outside source. [Link](https://ryanfeigenbaum.com/dark-mode/) did an amazing job at building these sun and moon buttons!


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

Then assign a class to the buttons. <use></use> was new to me and I learned that it takes nodes from the SVG document and duplicates them somewhere else. Handy! 


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

## Step 3 
 Add your CSS. I didn't want to change any styling the creator chose, so I decided to keep the CSS for the buttons. 


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

## Step 4

Javascript! Functions! ListenerEvents! I attached a listenerEvent to my toggle button and used forEach so that with each it fires off my toggle function. My site's default is dark mode, so the function is to toggle to light. 


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


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

## Conclusion 

And that's it! This was a fun first project and I can't wait to see what else I learn!
Collection of augmented reality samples for iOS
Tags: swift, arkit
Published: 2022-05-15 04:21:31


## Introduction

This is my first time posting on Dev.to! I have just released a collection of AR functions that can be done using iOS as an open source.

## Background

In developing an app (or any system), we usually define the user's problem and its solution, then design and develop it. When AR was included in this process, there were several times when we implemented it but ended up not releasing it to the production. In the case of the normal screen(2D) UIUX development, design tools such as Figma can help to quickly and inexpensively identify the "wrongness", and best practices and guidelines are available, to begin with, but this is not yet the case with AR.

As a result, when a design is implemented but not adopted for the production environment, the motivation of the person in charge is down, knowledge is not accumulated, and so on.
Therefore, we decided to create something like a list of functions, hoping that it would be possible to have a rough understanding of "what AR can do" in a list, and then try it out or make some changes and verify it to ship better experience.

## Code

[Tavia Experiments](https://github.com/tavia-oss/TaviaExperiments
)

## Execution environment
- Xcode: Version 13.3
- iOS: 15.4.1 (iOS 15.0 or higher is required to build)
- Device: iPhone XS Max, 12 Pro

## List of Features

1. Place Image Center
![1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kum0gqo9amsj000b7im7.GIF)

2. Place Video Center
![2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qpr1ulrrrzk4ctcsbpu4.GIF) 

3. Place Object Center
![3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nz5q6t0ni62y58dcnhsw.GIF)

4. Place Gif Center
![4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7tzpu2uc60g25r0x8vbo.GIF)
 

5. Place Image At Tapped
![5](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ok8p1g0t5x0db35memr8.GIF)
 

6. Detect, Crop And Place Alphanumeric
![6](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j5r8cgl05uxci425uasf.GIF) 

7. Detect And Crop Color
![7](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9ei6y18e0a1d2sckcnv6.GIF)
  
Please check out the code from here.
https://github.com/tavia-oss/TaviaExperiments
Introduction to Azure Container Apps
Tags: azure, tutorial, kubernetes, cloud
Published: 2022-05-15 03:53:17

---
title: Introduction to Azure Container Apps
published: true
description: 
tags: azure,tutorial,kubernetes,cloud
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/elo8sijawolr1gwx5c9p.png
---

[Azure Container Apps](https://docs.microsoft.com/en-us/azure/container-apps/) is a serverless container platform that we can use to run microservices and containerized applications without having to worry about managing complex infrastructure and container orchestrations.

In this video, I introduce the key concepts and features of Azure Container Apps and go through a demo on how you can create a simple Container App using Bicep.

{% embed https://www.youtube.com/watch?v=6JryE0Hh_Fw %}

If you have any question about this video or Azure Container Apps in general, feel free to comment below or reach out to me on [Twitter](https://twitter.com/willvelida).

Until next time, Happy coding! 🤓🖥️
30 days of Leapfrog Student Partnership Program Learning Challenge.
Tags: productivity, challenge
Published: 2022-05-15 03:35:07

Actually, the learning challenge is of 60 days, but I am writing this article as I have completed the halfway to challenge. The challenge started on April 14, 2022. The challenge is as a title defined, to learn new or some thing related to the IT or tech stuff.

I was excited for the challenge and still am to complete it. During the halfway to the challenge, I learned about the SOLID principles, design patterns, Microservices, UI design in figma, read articles on blockchain, cryptocurrency, web3, and many more.

Also, the challenge needed us to tweet the learning of the day.
I have been able to tweet everyday till halfway of the challenge and looking forward to complete without break.

twitter link: [aakash shakya] (https://twitter.com/__aakas__)
Retail Website built with Django P4 (2020-02-10)
Tags: django, dailynotes
Published: 2022-05-15 02:38:21


## Django:
---
### template `{{forloop.counter0}}`
```html
{% for image in item.itemimage_set.all %}
<li data-target="#item{{item.pk}}Carousel" data-slide-to="{{forloop.counter0}}"></li>
{% endfor %}
```
`forloop.counter0` is 0-indexed
`forloop.counter` is 1-indexed

more variables in forloop can be found [here](https://docs.djangoproject.com/en/3.0/ref/templates/builtins/#for):
* forloop.revcounter
* forloop.revcounter0
* forloop.first
* forloop.last
* forloop.parentloop

### ForeignKey.on_delete
`ForeignKey` takes in `on_delete` argument to deal with the situation where the `ForeignKey` object is being deleted. The value of `on_delete` argument represents this behaviour. There are 3 options (In the examples below, `Item` model has `Category` as a `ForeignKey`):

* `on_delete=models.CASCADE` : deleting a foreign object, i.e. a `category`, will automatically delete all of the `item`s under that category
* `on_delete=models.PROTECT`: deleteing a foreign object, i.e. a `category`, will automatically prompt 'Can Not Delete' if there's `item`s under that category, And the `item`s will be listed
* `on_delete=models.SET_NULL`: deleteing a foreign object, i.e. a `category`, will set this foreign key to `Null` in all of the `item`s originally under that category.

---
### Google Font
1. Go to Google Fonts: https://fonts.google.com/
2. add the fonts for your website
3. interact with the pop up at bottom right corner
4. copy url
5. go to your css file
6. paste: @import url(...)
7. apply the font into css element as usual (font-family: 'Forum', cursive;). you can also copy this on the popup

---


## Python
---
### why @property decorator? [SO question ref](https://stackoverflow.com/questions/58558989/what-does-djangos-property-do)

* the function within the class can be accessed like a class' property instead of a function()
  1. you don't have to call it with `()` to gain access to the result
  2. you can pass parameter into it and process existing class values
    ```python
    class Person(models.Model):
      first_name = models.CharField(max_length=50)
      last_name = models.CharField(max_length=50)
      birth_date = models.DateField()
      
      @property
      def full_name(self):
        "Returns the person's full name."
        return '%s %s' % (self.first_name, self.last_name)
      
      @full_name.setter
      def full_name(self, value):
         names = value.split(' ')
         self.first_name = names[0]
         self.last_name = names[1]
    ```
  

## VS Code
---
Shortcuts - Find and replace:
* Find: command + F
* Add next occurrence: command + D
* Add ALL occurrences: option + Enter
* Replacement: command + option + F
* Replace: command + Enter
Retail Website built with Django P2 (2020-02-05)
Tags: django, dailynotes
Published: 2022-05-15 02:34:18


## Django:
---
### Animate your element
* [**Animate.css**](https://daneden.github.io/animate.css/)
* [**wowjs**](https://wowjs.uk/docs.html)
* [StackO: how to animate an image](https://stackoverflow.com/questions/46547695/how-to-animate-a-image-with-waypoint-or-wow-with-bootstrap-4)

---
### after cloned a django project:
execute the following command
```bash
$ python3 -m venv venv
$ source venv/bin/activate
(venv) $ pip install -r requirement.txt
(venv) $ pythong manage.py runserver 127.0.0.1:8080 #(or some other port)
```

---
### Django admin site

* `$ python manage.py creatsuperuser` creates users with attr `is_superuser` or `is_staff`
* `class ModelAdmin` from `django.contrib.admin`
  - if you need to make changes to the default admin interface, you need to create a object of `ModelAdmin` like so: `class AuthorAdmin(admin.ModelAdmin):`, this represent `Author` model on admin dashboard
  - instead of registering like this: `admin.site.register(Author)`, you have to use a decorator to your `AuthorAdmin` class like so:
    ```python
    from django.contrib import admin
    from .models import Author
    from myproject.admin_site import custom_admin_site
    
    # Reader and Editor objects have to have a ForeignKey field pointing at Author
    @admin.register(Author, Reader, Editor, site=custom_admin_site)
    class AuthorAdmin(admin.ModelAdmin):
    	pass
    ```
    
  - Create [InlineModelAdmin](https://docs.djangoproject.com/en/3.0/ref/contrib/admin/#inlinemodeladmin-objects) object to display extra info on a model in admin add page.
React Django Deployment
Published: 2022-05-15 02:29:15


This is a post about React Django Deployment on VPS Ubuntu LTS 18.04. I couldn't find any detailed guide or tutorials for newbies so I guess sharing my experience is the best I can do for now.

## GitHub pull

Basically, everything is up in the repo. All you need is to pull/clone your repo into your Ubuntu directory. Install virtual environment for Django, run `pip install -r requirements.txt`, go to your `frontend` app where your frontend React files live and run `npm install`.

But before that you might need to install `node.js` and `npm`, which should have been a piece of cake however, Ubuntu didn't make it easy.

## Install `node` and `npm` on Ubuntu 18.04

The node.js version on Ubuntu is quite old (8+). So follow these steps:

```bash
$ sodu apt install curl
```

install `curl` and download and execute the Node.js 10.x installer:

```bash
$ curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
```

Then install the package. This will automatically install `npm` as well. Thanks for the [post](https://joshtronic.com/2018/05/08/how-to-install-nodejs-10-on-ubuntu-1804-lts/) by Josh Tronic.

```bash
$ sudo apt install nodejs
```

Check your version by typing

```bash
$ node -v
v10.20.1
$ npm -v
6.14.4
```

## Notes on deployment

- migrattion: remember to ignore migration files when you FIRST deploy the Django app because if you do not and you've made many migrations locally for the mistakes you made during the development process: when deploying the app, migration changes can not be detected, hence no migrations will be made.
- imported image urls: somehow after webpack compiles the js files to `main.js`, Django `collectstatic` command copies all the necessary static files into the `static` folder in root folder, HOWEVER, the url for those imported images (`import BG from './assets/img/bg.jpg'`) in js files can not maintain the correct link (to `http://www.domain.com/static/img/bg.jpg`), instead, it links to `http://www.domain.com/bg.jpg`. I still can't figure out whether it's a webpack.config issue or python settings issue...
- `main.js` is 700kb it's apparently too slow to load from a Russian VPS server to local (China), takes 60 seconds to load. However, it's 7 seconds to load from LA, US. I'll try to split the file ([source](https://webpack.js.org/guides/code-splitting/))
what is eugenics in software and why should we support it
Tags: productivity, career, news, devjournal
Published: 2022-05-15 02:28:49



## **eugenics in software is;**

> eugenics in software, leaving old technologies, constantly turning eugenics in software, constantly turning to current technologies, taking care to contribute to the betterment of new technologies, and completely cutting off support for old technologies and their users **BECAUSE SOFTWARE İS İNNOVATİON AND IT NEEDS TO BE RENEWED TO ENSURE INNOVATION**


## why we must support it
 (Be objective and read)
We should support eugenics in software because the biggest factor that enabled the software world to come to this day was that the old software developers left the old and developed the new technology when the new technology came out. This continued until the 1990s, but now we almost stopped. Due to the overcrowding in our industry, it has become difficult for people who do their job well to win and to head straight, we have come to a border and we have to leave something to cross the border, just like the space shuttle that will pass through the atmosphere. Let me give you a proof. Before the 2000s, 300 delayed programming languages ​​were released. After the 2000s, only 99 and only 5, 6 of them are used. Every time I argue with a php developer he tells me "97% of websites use php" this is nothing to brag about, it just shows how bad we've gotten. People who only prepare a script and sell it by constantly changing it, people who make a site using wordpress and call themselves wordpress "developers" and technologies that came out before the 1990s are only a hindrance to the sector and the biggest obstacle in our development. Friends, we have brought this sector to the fore too much. Computer is a science, but there are not so many hindrances in any branch of science, people whose only purpose is to make money are undermining our tree. That's why we have to filter, so we have to support eugenics in software, if we do, we can reach dazzling points. If we don't, web development will die in the coming years, just like the desktop.

## How can we support, what should we do

What we need to do is to focus our potential on the future. Don't think of it as one-sided, again versatile, again very diverse. For example, think of a bus, developers who want to create innovation push this bus from behind and make it move, while those that need to be filtered sit inside and only become a load, making the bus heavier and preventing us from moving forward. What we need to do is to download or update them, so we can go faster. We do embedded system programming in C because c is faster and can directly interfere with ram and so on. The only reason it can't be done in current languages is that we don't develop it. There is no such thing as impossible in this world.
Install `Fira Code Font` in VSCode
Tags: beginners, vscode
Published: 2022-05-15 02:23:15

"Fira Code" is a font which helps the readability of your code. This is how you install it on VSCode.

- Firstly, install the font:
  You can run the following command on mac or visit [this post on github](https://github.com/tonsky/FiraCode/wiki/Installing) for other OS.

```bash
brew tap homebrew/cask-fonts
brew cask install font-fira-code
```

- Edit the`settings.json` file in VSCode

```json
//settings.json
{
  //...
  "editor.fontFamily": "'Fira Code', Menlo, Monaco, 'Courier New', monospace",
  "editor.fontLigatures": true
}
```

- Other ways and more options [visit this post here](https://github.com/tonsky/FiraCode/wiki/VS-Code-Instructions)
TECH BLOGGER
Tags: javascript, webdev, beginners, programming
Published: 2022-05-15 02:07:31

STAN SOCIAL 

Hello there,

I'm almost convinced that blogging isn't for me, but I've come back because I want to prove my enemies wrong .

In today's post I am going to vent about a mini project I’ve thought about but I haven't decided exactly what the next steps should be to make this project a reality..

BRIEF SUMMARY 
   The purpose of my website is to help Social media influencers develop additional content so they can make more money. While I understand that growing a social media page takes creativity, dedication, determination, and consistency, why then keep it just a page? Outside of maximizing social media mentions for the brands you are affiliated with, Stan Social is also a tool for selling, networking, and other promotions.


We have a lot of social media platforms like;
1.Instagram
2.YouTube
3.Snap-chat
4.TikTok
5.Twitter

Some influencers become popular on these platforms if they have a certain amount of followers and views.  Creators can earn revenue from on-demand videos and live stream feeds. They can even launch their own branded apps that can be viewed on Android, iOS, Apple TV, Roku, and Tizen. It's no secret that they are faced with the dilemma of how to do this while engaging their followers. Here is where Stan Social comes in. We connect you with experienced content writers and social media managers, allowing you to grow your brand through our platform.
We are able to do it at a discounted price , which is a win-win situation.Some may say that I could just hire someone to manage my Facebook page, but that isn't the same as what Stan Social will provide. Stan Social offers a number of perks without any underlying agenda.

DEPLOYMENT PROCESS
Although I know this project has more potential than I have presented to you, I need to rethink how to enhance the activities it encompasses.


Things that I have learnt building this project,
▶️ Good Folder structure for Projects
▶️ How to use J-query
▶️ creating inputs with icons inside 
▶️ How to use font awesome icons
▶️ Use of scroll down effect
▶️ How to deploy from Git-hub to Vercel



https://stan-social.vercel.app/


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



It would be great to hear your suggestions!
That’s all Folks!❤️