teleren/devto huggingface dataset:
Paper Dashboard Angular | Made with Angular JS | Template
Published: 2022-06-28 15:17:34

![Paper Dashboard Angular | Made with Javascript | Angular JS](https://res.cloudinary.com/madewithjavascript/image/upload/v1655864420/large_paper_dashboard_angular_template_free_8089d08573.jpg "Paper Dashboard Angular | Made with Javascript | Angular JS")


### FREE BOOTSTRAP ANGULAR ADMIN TEMPLATE

> Paper Dashboard Angular is a Bootstrap Admin Template which combines soft colors with beautiful typography and spacious cards and graphics. It was built on top of Google's Angular Framework and the HTML version of Paper Dashboard. It is a powerful dashboard but it is light and easy to be used. It has enough features to allow you to get the job done, but it is not crowded to the point where you can't find the files for a specific component.
> 
> We like consistency and design that blends into its purpose. Paper Dashboard Angular is a perfect example of our most thoughtful work. It combines over a dozen components and plugins, while looking like everything fits together. For an easy start or inspiration for you project, we have also create a set of example pages, like the user settings or usage graphics.
> 
> Paper Dashboard Angular is built using the same design language as Paper Kit, which you can use for the presentation pages of your website. You can easily use them together, or pick between them depending on the project you have.

## Check out more such amazing projects on our website

[Made with Javascript](https://madewithjavascript.club)

## Want us to feature your project

[Submit your Project to Made with Javascript](https://madewithjavascript.club/submit-project)


You can also write to us for any of your queries at:

[Email Made with Javascript](mailto:madewithjavascript@gmail.com)

## Project already shared on our social media handles.

| SocialMedia | SharedLink |
| ----------- | ---------- |
| Twitter | [Paper Dashboard Angular on Twitter](https://twitter.com/withjavascript/status/1541801856824971264?s=20&t=sZBfDkdKJ5TrOZoqTK68fQ)
 |
| Medium | [Paper Dashboard Angular on Medium](https://medium.com/@madewithjavascript/paper-dashboard-angular-made-with-angular-js-template-8a586f60c54)
 |
| Facebook | [Paper Dashboard Angular on Facebook](https://www.facebook.com/madewithjavascript/posts/pfbid08tEWtyTJ7qiNC5yJWAhdLZLnD6848VSi6jBLcKDCD4Tez4j2ZfETu7oWq1EAEydrl)
 |
| Tumblr | [Paper Dashboard Angular on Tumblr](https://www.tumblr.com/blog/view/madewithjavascript/688316092903555072?source=share)
 |
| LinkedIn | [Paper Dashboard Angular on LinkedIn](https://www.linkedin.com/feed/update/urn:li:activity:6947567689410256896)
 |
| Pinterest | [Paper Dashboard Angular on Pinterest](https://pin.it/5mqAr7k)
 |


Filled Under:


 - [Made with Javascript](https://madewithjavascript.club)
 - [Made with Angular JS](https://madewithjavascript.club/categories/angular-js)

Make sure to give this post ❤ 50 ❤ hearts, click the 🦄 unicorns 🦄 and follow 👉 @madewithjavascript 👈 for more such awesome showcases. Show you love for the people who have worked so hard!
Create gesture control for flutter video player using chewie.
Tags: flutter, gesturecontrol, videoplayer, chewie
Published: 2022-06-28 15:14:21

Building controls from scratch can be tricky usually with drag gesture. [Here's](https://www.codef.site/blog/flutter/create-custom-gesture-control-for-flutter-video-player-using-chewie) a guide on how to create gesture like sliding vertical to increase/decrease volume or brightness, double tap to play/pause, fast-forward, fast-rewind and sliding horizontally will change the position of video according to the dragged distance in seconds.
A month without the YouTube Rabbit Hole 🕳️
Tags: productivity, tooling
Published: 2022-06-28 15:12:18

## Identifying the Problem
![Chef Ramsay](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6bm2weqfpkwvjghaxzb.png)

Spending a couple of minutes on YouTube might not be that much of a problem, watching memes can be fun and joyful for lots of people, but when it's 2AM and you're trying to wake up early for work/school/university etc.. and you cannot resist the urge to watch just one more video of cute kittens or memes. 

In this case you have successfully fallen into the **YouTube Rabbit Hole**.

## A Solution

[**Unhook**](https://unhook.app/)
![Unhook Website Homepage](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xiojmnix3nrs9fry0x8d.png)
 
I've discovered **Unhook** which is a Google Chrome Extension that hides some features of YouTube, specifically the ones that make you stay on the platform.

![YouTube unhook gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zsr7u8vqyizhqtuq5qv0.gif)
 
I've decided to try this extension for a month, since I wasn't a fan of being stuck in the YouTube rabbit hole at 2AM because it pretty much ruined my sleep schedule and my productivity.

## Time Management
![Cat playing with a clock](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vavneu938xy29w6q6x94.png)
 


Another solution for me was time management, where I've used [**Noisli**](https://www.noisli.com/) to set a timer for **X** minutes/hours for watching a YouTube video, or even browsing a social media platform.

Personally this solution didn't work as good as using the Unhook extension but it helped me with the procrastination problem while I was coding or doing university work.

## The Result

![Gandalf Reading](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9yklxy8n0ijmzq63vw9u.gif) 
 

It's interesting that within the first few days of testing the extension somehow it felt like something was wrong it was as if my brain was telling me that it's **not enough** and I needed to **watch one more video**.

![Ironman on Computers](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pdl7th1odrtj0lukl1ix.png)
 

I used to spend hours on YouTube where I've had issues with my sleep schedule and my productivity, but after a month of using this extension I've been able to search videos while working **without any distractions or any procrastination** which increased my productivity drastically.

### (Disclaimer: I wrote this blog post based on my own opinions and experience)
Ubuntu commands
Published: 2022-06-28 15:03:42

- Command 'df' Short of "desk free". used to check available disk on system. Displays the information of file system device names, disk blocks, total disk space used, available disk space, percentage of usage and mount points on a file system
```shell
$ df
```

- With df add -h to display Disk Space in Human Readable Format like in MB and GB.
```shell
$ df -h
```

- Show only your home file system information.
```shell
$ df -h /home
```

- Change directory/Folder.
```shell
$ cd /folder_name
```

- Show just the names of files and directories existing in your present directory.
```shell
$ ls
```

- Show list of all the files and directories existing along with the details like permissions, ownership, size etc.
```shell
$ ll
```
Virtualization _ Virtual Machine_ Hypervisor
Published: 2022-06-28 14:55:11

## Virtualization

- It is an advanced software engineering concept that allows creating of virtual servers, storage, and network.

- It creates a virtual computer system.

- It helps to run more than one operating system in a single system

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

### Need for virtualization

- It helps in data transfer, protects from system failure, reduces the cost of operation, and provides security to data.

- With the help of virtualization we can run a virtual server at a single physical server. 

## Virtual Machine

- virtual machines are virtual systems which are having their system and application.

- virtual machines are the software that runs in a physical system and provides virtual computers inside a physical computer. 

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

## Hypervisor 
- Hypervisor creates and manages virtual machines.
- It allocates host resources to each virtual machine.
- It provides multiple guest virtual machines to share host resources.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eypvd79axm5ekg4izy0z.png)
 

###Two types of Hypervisor

1. Type-1 or Bare- metal Hypervisor
       - It runs directly on the hardware 
       - it is more secure as it is directly installed on the hardware.
       - no Operation system layer is involved so it performs better and more efficiently.

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

2. Type-2 or Hosted Hypervisor
       - It runs on a host operating system.
       - It is generally used on student laptops, desktops, etc.
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sfufqwbgriymzeeyqrf6.png)
Just finished a master in PHP and Laravel
Tags: php, laravel, beginners, webdev
Published: 2022-06-28 14:54:12

Hi everyone!

I just finished a course in Udemy. This time i learned about PHP MVC working with Laravel and Symfony. It was a very complete course with database projects using MySQL and quite a deep insight in web creating with Wordpress. 

I am just starting to bring this knowledge into a couple projects I am working on but i feel like I just devoured that 60h course. I am excited to keep learning with Udemy courses, I am very pleased with how didactic they are! 

Next week I will look into some NodeJS courses and keep this journal posted with my choice. Meanwhile this is the PHP course if anyone is interested: https://www.udemy.com/share/1013jU3@P3t87qWjaQBNxcZu5MNuoD-yonyliL_WF2yPD7cOADQy7EFLmehGPcuaI-3bh6alLg==/
DEV Team Update
Tags: meta
Published: 2022-06-28 14:48:41

Earlier today, we held a company All Hands meeting where we shared that we’d be saying goodbye to a portion of our team in the form of layoffs.  As an organization built around the principle of serving our community here at DEV, we wanted to provide all of you with a quick overview of the factors that played into that decision and a preview of changes you can expect in the coming days and months.

Over the past few months, we’ve closely followed the changing economic conditions impacting the tech industry.  These are turbulent and uncertain times for companies at our stage, and we decided that we needed to take active steps in order to shore up our operations and ensure our long term sustainability.  Our highest commitment will always be serving the community, and we’re taking these hard steps in order to ensure we can continue upholding that promise.

We’re parting ways with an absolutely amazing group of friends, teammates, and contributors who have been instrumental to the DEV and Forem journey.  Each of these individuals will forever be an important part of our story.  Both in cultivating the community here on DEV, along with our longer-term mission of providing free and open source building blocks for creating safe, modern, and independent communities with Forem.

As part of this change, we will be redoubling our focus on serving the community here on DEV and on our sister community, [CodeNewbie](https://community.codenewbie.org).  You can expect significant improvements to the core elements of the member experience, and a renewed emphasis on ensuring DEV and CodeNewbie serve as valuable and constructive destinations in the developer ecosystem.

If you are hiring for roles across Engineering, (Ruby on Rails, JavaScript, Cloud hosting), Design, and/or Podcast Production, **please reach out to peter@forem.com**.  I’d love to help put you in touch with some wonderful people — I know that each one of them is going to be an extremely valued contributor wherever they join next.
Introducing Our Engineering Progression Framework
Tags: leadership, devops, devrel, tutorial
Published: 2022-06-28 14:45:58

At the beginning of 2022 we wrapped up the first version of our Engineering Progression Framework. Now we’ve been using it internally for a little while, we also wanted to share it more widely, to help others learn more about Engineering here.

**A progression framework is a communication tool that supports fairness**

Before we jump into the details, here’s a quick overview of what we mean when we talk about a "progression framework".

Quite simply, it’s a set of shared expectations that we use to explain what we expect of engineers at different levels of seniority. Each level is described in the framework with a description, plus an illustration of the type of behaviours, impact, and skills we think are reflective of someone at that level.

However, importantly, it’s not an exhaustive checklist. We’ve intentionally focused on a core set of examples that we think can fairly apply to any engineer here, but they’re not intended as a finite list of everything a great engineer could do or be. People will almost certainly be doing important things that aren’t in the framework. There are many 'shapes' of engineers, and we’ll aim to celebrate people’s different strengths whilst also aiming for fairness and clarity through our core expectations.

**We’re pretty pleased with the result, but we’re not finished!**

We’re planning to keep making improvements as we change and grow, but for now you can take a peek at what we’re using below:

**[Engineers](https://docs.google.com/presentation/d/1F2QH0q-AVh93IOOW3B5f-_SF9BJ4muSk/edit?usp=sharing&ouid=104042777269955323247&rtpof=true&sd=true)**
**[Engineering Managers](https://docs.google.com/presentation/d/1ReWxXyiU0Vo0XCE13kORgTtVEKkZH4uq/edit?usp=sharing&ouid=104042777269955323247&rtpof=true&sd=true)**

Historically in the engineering space the only way for engineers to progress was through stopping coding and moving into management. We believe these are fundamentally different sets of skills, and we want to make sure all our engineers have the opportunity to progress without changing career. That said, for many folks, moving into management and creating systems to help engineers do their best is where they find their future lies, so you can see we support a switch of framework once engineers reach a certain level. We’re also planning to support folks who want to "swing on the engineer/manager pendulum", and switch back to engineering after a couple of years.

**What’s next?**

This framework will naturally evolve as we apply it – it will never be finished or perfect, and it is to be considered a living document, so our teams and our managers will help steer this.

**Important** 😸

I regularly post useful content related to Azure, DevOps and Engineering on Twitter. You should consider following me on [Twitter](https://twitter.com/GhostInTheWire5)
Introduction to Data Structures and Algorithms.
Published: 2022-06-28 14:45:26

Data structures are ways to store data whilst algorithms are step by step procedures in solving problems, for instance computer problems.
Each data structure has an interface. Interface represents the set of operations that a data structure supports. An interface only provides the list of supported operations, type of parameters they can accept and return type of these operations. 
**Characteristics of a Data Structure** 
** Correctness** − Data structure implementation should implement its interface correctly. 
 **Time Complexity** − Running time or the execution time of operations of data structure must be as small as possible.  **Space Complexity****** − Memory usage of a data structure operation should be as little as possible.

**Need for Data Structure**
As applications are getting complex and data rich, there are three common problems that applications face now-a-days.  **Data Search **− Consider an inventory of 1 million-(106) items of a store. If the application is to search an item, it has to search an item in 1 million-(106) items every time slowing down the search. As data grows, search will become slower.
**Processor speed** − Processor speed although being very high, falls limited if the data grows to billion records.  **Multiple requests **− As thousands of users can search data simultaneously on a web server, even the fast server fails while searching the data.   Data can be organized in a data structure in such a way that all items may not be required to be searched, and the required data can be searched almost instantly.  

**Execution Time Cases**
There are three cases which are usually used to compare various data structure's execution time in a relative manner.  **Worst Case** − This is the scenario where a particular data structure operation takes maximum time it can take. If an operation's worst case time is ƒ(n) then this operation will not take more than ƒ(n) time where ƒ(n) represents function of n sometimes narrated as Big-O.
**Average Case** − This is the scenario depicting the average execution time of an operation of a data structure. If an operation takes ƒ(n) time in execution, then m operations will take mƒ(n) time, also referred as Theta notation.
**Best Case** − This is the scenario depicting the least possible execution time of an operation of a data structure. If an operation takes ƒ(n) time in execution, then the actual operation may take time as the random number which would be maximum as ƒ(n)and is also referred as Omega.

**Compound data types**
Compound data types consist of more than one element. You may combine primitive data types to form compound data types. Any compound data type can have elements of any other valid data types.
  Lists
  Set
  Dictionaries
  Strings 
  Hashes 
  Structures
  Pointers
Are you writing automated tests for your architecture?
Tags: softwaredesign, architecture
Published: 2022-06-28 14:44:45

###### I am always posting provoking post on my Linkedin, and I have decided to replicate those here. [Let's socialize!](https://www.linkedin.com/in/alexsandro-souza-dev)

Once upon a time, somebody experienced looked at the code and drew up some nice architecture diagrams, showing the components the system should consist of and how they should interact. However, when the project got bigger, there were more and more cases where new features would just be added in any way that fits. 

That is it! A big ball of mud was just created.

The good news is that there are several free tools out there to automatically test for dependencies between packages and classes and ensure the architecture decisions are followed. 

Simply put, there are test libraries that allow us to verify that an application adheres to a given set of architectural rules.

Here is an example using ArchUnit(Java library).

```
JavaClasses jc = new ClassFileImporter().importPackages("com.apssouza.tradingengine");

LayeredArchitecture arch = layeredArchitecture() 
// Define layers 
.layer("Presentation").definedBy("..presentation..")
.layer("Service").definedBy("..service..") 
.layer("Persistence").definedBy("..persistence..") 
// Add constraints 
.whereLayer("Presentation").mayNotBeAccessedByAnyLayer() 
.whereLayer("Service").mayOnlyBeAccessedByLayers("Presentation") 
.whereLayer("Persistence").mayOnlyBeAccessedByLayers("Service"); 

arch.check(jc);
```

The link between architecture traits and maintainability is a [well-studied](https://www.diva-portal.org/smash/get/diva2:837619/FULLTEXT01.pdf) topic in the software industry. Defining a suitable architecture for our systems is not enough, though. We need to make sure that the code implemented adheres to it.

[Please check out my post explaining how to structure code effectively](https://dev.to/apssouza22/we-are-structuring-software-incorrectly-4oab)
DevBox Showcase: CSS Shadow Generator
Tags: productivity, css, tutorial, tooling
Published: 2022-06-28 14:44:39

Hi 👋,

_This is the next post in the series showcasing tools from [DevBox](https://www.dev-box.app) 🎉, an application (desktop, browser extension or web) that contains many useful tools and cheat-sheets._

-------

Have you ever needed a nice looking CSS shadow? DevBox has a tool to generate one! Here is a short video to about it:

{% vimeo 724904024 %}

It has some handy gizmos to tweak the shadow:

* Light position using a 2D interactive field.
* Color picker for the background.
* A toggle to so the shadow matches the background.
* Sliders for opacity, elevation and resolution.

-------

More DevBox showcases are coming, so follow me here if you want to be notified!
Paracetamol.js💊| #156: Explica este código JavaScript
Tags: javascript, webdev, spanish, programming
Published: 2022-06-28 14:42:49

## **<center>Explica este código JavaScript</center>**
#### <center>**Dificultad:** <mark>Básico</mark></center>

```js
const obj = {
  nombre: "Cris",
  apodo: "dux",
  direccion: {
    calle:"Olmos",
    zona: "Los olivos"
  }
}
console.log(obj.edad)
```

A. `false`
B. `SintaxisError`
C. `undefined`
D. `null`

Respuesta en el primer comentario.

---
Which language would suit me to learn? (Post consultation)
Tags: programming
Published: 2022-06-28 14:40:56

Hi everyone my name is Oral 20 years old from Israel, at first I studied code blocks like Scratch.
  I'm pretty much mastering the blocks, I got to move on to the real thing and jump into the water.
The problem is that there are full programming languages so I do not know what to choose
I would love a recommendation for a programming language that is suitable for those who have just finished with Scratch and other style sites
WebDevHub - a central place for web developers
Tags: webdev, opensource, tooling
Published: 2022-06-28 14:40:47

Hey guys!

I created an open source project to help make web development easier.

The idea for [WebDevHub] (https://github.com/THHamiltonSmith/webdevhub) is to be one central place for developers, that offers a variety of tools to help with any developing needs. This includes code formatters, file converters, image compressors etc.

A central hub with all the tools a developer might need makes it easier to focus on developing, rather then searching for different sites to find a working tool. WebDevHub eliminates this hassle. 

Since the site is open-source, it is designed to be made by the users. If there a feature you want to add, a bug you want to fix etc, simply open a pull request.

Feel free to check it out and contribute! The more devs who can help make the app the best it can be, the better. Check it out [here](https://github.com/THHamiltonSmith/webdevhub).


![WebDevHub home](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n1i8zomwv4gbuzbsniov.png)

![WebDevHub code formatter](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ydd7b1fmcbb6cpdcblrd.png)
Python With Django - Best Development Combination
Tags: django, python, development, application
Published: 2022-06-28 14:21:58

---
title: Python With Django - Best Development Combination
published: True
description: Django web development with Python is perhaps the most effective way to create web applications and write code for them
tags: django, python, development, application
# cover_image: https://programmers.io/wp-content/uploads/2022/05/Coding-on-a-laptop.jpg
# Use a ratio of 100:42 for best results.
---
Selecting the right technology for web development is a growing challenge for developers today. While there are multiple programming languages and frameworks available to work on, not many developers are able to pick the right solutions from the lot.

Not many programming languages or frameworks can meet client expectations in a manner as comprehensive as that done by [Python programming](https://programmers.io/python/) language with the Django framework. Python continues to be the most popular programming language in the world today, with Django its most popular framework. When both these powerhouses come together, they create strong web apps that are fun to work on and give desirable results.

In [this](https://programmers.io/django-python-development/) article, we take a look at the partnership of Django with Python and why the two continue to be the number one combination for most developers. Stay with us to understand the pros and learn more.