teleren/devto huggingface dataset:
How to auto-document the end-to-end code and data flows of your Rails app
Tags: rails, techtalks
Published: 2021-05-27 11:19:04

In case you missed it, I’m recapping my recent [RailsConf 2021](https://www.railsconf.org/) talk in a series of four, short blog posts. Check out [Part 1 - We need a better way to communicate and explain our code decisions](https://dev.to/appland/we-need-a-better-way-to-communicate-and-explain-our-code-decisions-1nic).

This post recaps the first of the demos I gave as part of my talk. **Using [AppMap](https://appland.com/products/appmap), I walked RailsConf attendees through how to automatically generate documentation and visualizations for end-to-end flows -- right in your code editor.**

End-to-end flows help us as developers get the right context. They help us figure out how a given web request uses particular database tables, for example, and they help us find important functions performed by code, such as authentication, authorization, and emailing. 

**AppMap offers both high-level and low-level views of end-to-end code and data flows.** AppMap behaves like a Google Map, providing interactive navigation of the code. You can write analysis code on the AppMap data, and dive into source code and debuggers for further details.

For Ruby, first install the [AppMap extension VSCode](https://appland.com/docs/quickstart/vscode/step-1.html) or the [AppMap plugin for RubyMine](https://appland.com/docs/quickstart/rubymine/step-1.html). Then install the AppMap gem into your Ruby app and configure which source files and dependency gems you want to record. Finally, record AppMap files by recording your code - either using [app remote recording](https://appland.com/docs/reference/appmap-ruby#remote-recording), or by running test cases. **Unlike static analysis, which only looks at your files on disk, AppMap records your code while it’s running -- meaning it knows exactly what happened at every point and how all the code, services and data stores fit together.**

You can watch this portion of my RailsConf talk in the video clip above, which includes a live tour of AppMap using the Rails Sample App. If you want to follow along in the code or look it up later, I’ve created a fork of the Rails Sample App sixth edition. Within that fork is [a branch called eager loading](http://github.com/land-of-apps/sample_app_6th_ed/tree/eager-loading). Let us know what you think in the [AppMap Discord](https://discord.com/invite/N9VUap6)! Your feedback is really important to us. 

**Coming up next** In Parts 3 and 4 of this blog series, I’m going to recap the remaining demos of my RailsConf talk. Using tools that automatically generate documentation and visualizations of architecture and code design, I’ll be documenting web services and data model details.
Wrapper Class vs Helper Class vs Controller Class
Tags: programming
Published: 2021-05-26 03:37:43

**Wrapper Class**: To wrap the Data types to make a single object which can be assessable easily in other classes.

**Controller Class** Controller class contains public methods called Action methods. Each method has a one-to-one link with a possible user action, ranging from the click of a button to another trigger. The controller class methods process input data, execute application logic and determine view.

```
public class WrapNitesh {

//CONTROLLER CLASS

    public list<wrapaccount> wrapaccountList { get; set; }
    public list<account> selectedAccounts{get;set;}    
      
      public WrapNitesh (){
      
     //if(wrapaccountList ==null){
          wrapaccountList =new list<wrapaccount>();
          for(account a:[select id,name,billingcity,phone from account limit 10]){
           wrapaccountlist.add(new wrapaccount(a));
        
           }
        // }
      }

    //### SELECTED ACCOUNT SHOWN BY THIS METHOD
      public void ProcessSelected(){
     selectedAccounts=new list<account>();
     
      for(wrapaccount wrapobj:wrapaccountlist){
           if(wrapobj.isSelected==true){
           selectedAccounts.add(wrapobj.accn);
           }
            
         }
      }
      
  //##THIS IS WRAPPER CLASS
   // account and checkbox taken in wrapper class
   
   public class wrapaccount{
    
    public account accn{get;set;}
    public boolean isSelected{get;set;}
     
       public wrapaccount(account a){
     
         accn=a;
         isselected=false;
       }
  }
}
```

**Helper Class** helper class is used to assist in providing some functionality, which isn't the main goal of the application or class in which it is used

```
function linesOf($mls) {
    return preg_split('/\s*\n\s*/',trim($mls));
}
```
Make A Payment From Apple Pay To Cash App Which Is A Non-Verified Account 
Tags: applepaytocashapp
Published: 2021-05-26 06:26:16

Do you want to make a payment from Apple Pay To Cash App account even if you are not using a verified account? Keep the fact in mind that you have to first verify your account and then you should make sure you have a common bank account associated with your Cash app account. 
https://www.experts-support.com/blog/transfer-money-from-apple-pay-to-cash-app
Diseconomies of Scale
Tags: scaling, efficiency, practices, team
Published: 2021-05-30 21:23:29

---
title: Diseconomies of Scale
published: true
date: 2021-05-26 00:00:00 UTC
tags: scaling,efficiency,practices,team
canonical_url: https://jhall.io/archive/2021/05/26/diseconomies-of-scale/
---

We’ve all heard of economies of scale: the increase in per-unit efficiency by producing or doing a large number of like things. This simple concept is probably the single biggest idea responsible for the industrial revolution.

And it’s become such an implicit part of our thinking that we often forget that not everything benefits from economies of scale. Some things have _diseconomies of scale_. Some things have both, with an inflection point of maximal efficiency:

 ![Diseconomies of scale chart](https://jhall.io/archive/images/diseconomies-of-scale-chart.png)

_[Image source](https://boycewire.com/types-of-diseconomies-of-scale/)_

Finding this point is rarely easy in a practice as complex as software development, but it’s worth making an effort to at least get closer to it!

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
Các mẫu cửa kính cường lực đẹp cập nhập t6-2021
Tags: cuakinhcuongluc
Published: 2021-05-26 10:10:12


Cửa kính cường lực mở quay, bản lề sàn
Cửa kính cường lực mở quay hay còn gọi là cửa kính bản lề sàn hoặc cửa kính thuỷ lực. Do lắp bằng kính cường lực nên cửa  có độ bền cao, ít hư hỏng, nên cửa được sử dụng nhiều nhất hiện nay trên thị trường.
Cửa có 2 loại chính là cửa 1 cánh hoặc 2 cánh, sử dụng bản lề sàn VVP Thái Lan hoặc các loại cao cấp khác như Adler ( Đức – hàng chính hãng, bảo hành lên tới 24 tháng, có check code SMS), hay phụ kiện Huy Hoàng do Việt Nam sản xuất ( Bảo hành chính hãng lên tới 24 tháng), hoặc bản lề cao cấp nhập khẩu Hafele.

Cửa kính cường lực bản lề sàn sử dụng đế sập nhôm để lắp đặt là loại phổ biến nhất Cũng có thể sử dụng một số loại khung khác như:

Cửa kính cường lực khung sắt : Sử dụng sắt hộp 40×80, sơn phun màu, tạo sự chắc chắn, đảm bảo.
Cửa kính cường lực khung nhôm: Sử dụng nhôm hệ 4500 Việt Pháp hoặc nhôm hệ Xingfa, đảm bảo tính thẩm mỹ cao và an toàn hơn
Cửa kính cường lực lùa, trượt
Cửa lùa trượt treo giúp khắc phục được một số hạn chế về diện tích của cửa mở quay đòi hỏi cần có không gian mở.
Cửa kính lùa, trượt có 3 loại chính là D25, lùa inox 10×30 ( thường lắp cabin), lùa ray nhôm, và hệ Jamilldoor.

Cửa lùa D25 là loại thông dụng hay được sử dụng nhất do chất lượng ổn định và giá thành tốt, cửa hệ Jamilldoor là loại bền bỉ nhất, chắc chắn nhất kén người sử dụng do giá thành tương đối cao.

Cửa kính cường lực giá bao nhiêu tiền 1m2 ? Cửa kính cường lực giá bao nhiêu?
Giá cửa kính thuỷ lực, cường lực giá hiện nay giá dao động chỉ từ 430,000 đ, đến 530,000 đối với kính cường lực 10mm và 12mm.
Giá cửa kính cường lực = Giá m2 kính cường lực + giá phụ kiện cửa kính cường lực

Nguồn: https://kinhennho.com/cua-kinh-cuong-luc/
JavaScript resources you must bookmark.
Tags: javascript
Published: 2021-05-26 15:44:29

---
title: JavaScript resources you must bookmark.
published: true
description: These are some great resources to consume as a JS developers. 
tags: JavaScript 
//cover_image: https://direct_url_to_image.jpg
---
1. JavaScript runtime visualizer
https://www.jsv9000.app/

2. Interactive JavaScript Tutorial
https://www.learn-js.org/en/

3. JavaScript Tutorial
https://www.javascripttutorial.net/

4. A Modern JavaScript Tutorial
https://javascript.info/

5. JavaScript Algorithm - 30 seconds of code
https://www.30secondsofcode.org/js/p/1

6. Build 30 things with vanilla JS in 30 days
https://javascript30.com/

7. JavaScript - The Right Way
https://jstherightway.org/

8. Free JavaScript Resources
https://www.java5cript.com/


Tip:- Pick one resource at a time. Enjoy the great contents.
online compiler for latex
Tags: latex, compiler, online
Published: 2021-05-26 17:09:10

check <a href="https://pythonslearning.com/2021/05/which-is-free-online-compiler-editor-for-latex.html">online latex compiler
LaTeX</a> is a software system for document preparation. When writing, the writer uses plain text as opposed to the formatted text found in "What You See Is What You Get" word processors like Microsoft Word, LibreOffice Writer and Apple Pages
Resources : https://pythonslearning.com/2021/05/which-is-free-online-compiler-editor-for-latex.html
#SpeedOfLife First Week Recap
Tags: speedoflife, softwaredelivery
Published: 2021-05-27 01:43:38

<h3>It Begins</h3>
We started the #SpeedOfLife campaign last week, yay!

It has been a bumpy start but we're happily moving forward. The first person I spoke with about delivering software at the speed of life was our CEO at Armory, DROdio. I posted a snippet of our conversation on Twitter last week and here that is 👇🏾
{% twitter 1390707475784011778 %}
A live stream happened.

{% youtube VfpuJckT_Tw%}


I'll let you be the judge of whether or not it was successful. It was mildly chaotic on my end but next time it will be better, I promise! We had at least one live viewer (shoutout to Morgan Lucas) and something awesome came out of my call into the void for a last-minute guest.

{% twitter 1390809997789982724 %}


I got a DM from a Performance Engineering Lead at MathWorks. She's interested in collaborating so hopefully I will be able to share a conversation between the two of us soon. I was able to chat with several people from the Armory crew about #SpeedOfLife and what it means to them. It's awesome to share their perspectives, but I'm super-excited to involve more of the DevOps community.


Look out for #SpeedOfLife on our social channels. I'll be back next Tuesday with another blog.
Top 11 Flutter Widgets To Know In 2021
Tags: flutter, apps, android
Published: 2021-05-27 14:21:52

These days, flutter is one of the most popular framework for developing mobile, web and desktop applications. It is full of widgets and it makes it more sustainable. Flutter widgets are used for developing high-quality cross platform applications because they are customizable and offer extensive flexibility & fluidity that can be the best fit for any mobile app type. Widget elements are organized in the form of a widget tree. The manner in which the widgets are placed defines the operation of the front-end of the native applications screen. The two primary things of Flutter widgets are the configuration and the widget state. There are lots of Flutter widgets available and here we’ll discuss the top 11 widgets for developing flutter apps. Before digging into the flutter widget list, let us see the  types of flutter widgets.

You can also know- Amazing New Features Of Flutter 2.0

#Types Of Flutter Widgets-
There are two types of Widgets in Flutter- Stateless widget and Stateful widget. Based on the two types, these widgets are further categorized into 14 different categories as- Async, Accessibility, Assets, Images and Icons, Layout, Interaction Models, Material components, Animation and motion, Painting and effects, styling, text.

#Top 11 Flutter Widgets-
**1. SafeArea-**
This widget is best to use for developing dynamic and adaptive UI. It helps to adjust the screen with various devices of different width and height. Also, it helps in overcoming the area constraints induced by status bar, notches, navigation bar etc. It’s implementation doesn’t allow the design to overlay any of the areas where there is frontend UI visibility constraint and so makes it error-free. Hence SafeArea widget is also known as padding widget that adds padding to android or iOS apps wherever there is a constraint. SafeArea widget will also indent the child with the necessary padding necessity, particularly for the devices with the Notch like iPhone X.

**2. ConstrainedBox-**
It is a built-in widget available in Flutter SDK. Generally it is used to add size limitations to the child widgets. It allows developers to add flexibility with respect to height and width in a child widget. But the widget has limitation when the child is bigger in size than the container. It cuts the child’s view, making the front end look somewhat out of the line. This issue can be tackled by not defining the maxHeight property and adjusting it to by default value of double.infinity. Example of this widget is- 

if you wanted child to have a minimum height of 50.0 logical pixels, you could use const BoxConstraints(minHeight: 50.0) as the constraints.

**3. Align Widget-**
You should organize components inside the UI. Flutter can compose these widgets together. But how do we position a child under a parent widget? We can use the Align widget. For instance, how we choose the position of the text inside a container. Following code shows you the result.

Know more at- [https://solaceinfotech.com/blog/top-11-flutter-widgets-to-know-in-2021/]
Made a Real Time Chat Application using React.js
Tags: react, webdev, javascript, css
Published: 2021-05-27 17:04:10

1.This is a fully functional **Real time Chat Application** made using React.js with functionalities like online status,image support,Read receipent,multiple rooms

2.Link to **Github repo**-> [Link](https://github.com/bhavesh1235/React-Chat-App)
If you like the project please give it a **star** at github 

3.Backend is hosted by [https://chatengine.io](https://chatengine.io)
Some Docker commands make your life easier
Published: 2021-05-27 18:16:51

In this post, I show some useful docker commands that you may be less familiar with them and they make your life easier as a developer. Lets begin with build command:

```yml
docker build -f path/to/file/Dockerfile -t image-name .
```
#####`-f` lets you specify the path to `Dockerfile`.

####Tag or rename image
```yml
docker tag old-image-name new-image-name
```

######You Can use image id rather than image name:
```yml
docker tag 0e5574283393 new-image-name
```

####Save image:
```yml
docker save image-name -o output-image-name
```
######If the image name contains `/`:
```yml
docker save image-name/image-name > output-image-name
```

####Load image:
```yml
docker load --input output-image-name
```

####Remove images that name starting with `myimage`
```yml
docker rmi $(docker image ls 'myimage*' -q)
```
######Delete images whose names starting with `myimage`.

####Delete all untagged images
```yml
docker rmi $(docker images -f "dangling=true" -q)
```

####Delete all images (warning)
```yml
docker rmi -f $(docker images -q)
```

####Start all stopped containers
```yml
docker start $(docker ps -aq)
```

####Stop all running containers
```yml
docker stop $(docker ps -q)
```

####Delete all containers
```yml
docker rm $(docker ps -aq)
or
docker container stop $(docker container ls –aq) && docker system prune –af ––volumes
```

####Delete any resources — images, containers, volumes, and networks — that are dangling (warning)
```yml
docker system prune
```

####Delete any stopped containers and all unused images (warning)
```yml
docker system prune -a
```

####Copy file to container
```yml
docker cp ./path/to/file.ext container-name:/path/to/destination/inside/container
```

####Build an image from running container
```yml
docker commit container-name image-name:tag
```

####Mount file to a container
```yml
docker run -v /path/to/file/appsettings.json:/app/appsettings.json --name my-image image-name
```

####Get into a Docker container's shell
```yml
docker exec -it container-name /bin/bash
```

####Display volumes with mounted path
```yml
docker ps --format 'table {{.ID}}\t{{.Names}}\t{{.Image}}\t{{.Mounts}}'
```
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/676xmi4teqdne344t1fi.jpg)

####Delete volumes whose names starting with `myvloume`.
```yml
docker volume rm $(docker volume ls --filter name=myvloume -q)
```

####Delete dangling volumes
```yml
docker volume ls -f dangling=true
```

####Build docker-compose from several files
```yml
docker-compose -f docker-compose.yml -f docker-compose.dev.yml build
```

####Scale a service
```yml
docker-compose scale service-name=2
```

**Command that contains `$` could be executed on windows command prompt (cmd), use `PowerShell` instead**
Finding the Longest Word in a String
Tags: javascript, tutorial, beginners, webdev
Published: 2021-05-27 21:03:16

* Let's return the length of the longest word in the provided sentence.
* Also the response should be a number in this instance.
```
function findLongestWordLength(str) {
  return str.length;
}

findLongestWordLength("The quick brown fox jumped over the lazy dog");
```
* Answer:
```
function findLongestWordLength(str) {
  let words = str.split(" ");
  let longest = "";
  for (let i = 0; i < words.length; i ++) {
    let tempLong = words[i];
    if (tempLong.length > longest.length) {
      longest = tempLong;
    }
  }
  return longest.length;
}

findLongestWordLength("The quick brown fox jumped over the lazy dog"); // will display 6
```
#### Code Explanation
* Take the string and convert it into an array of words. Declare a variable to keep track of the maximum length and loop from 0 to the length of the array of words.
* Then check for the longest word by comparing the current word to the previous one and storing the new longest word. At the end of the loop just return the number value of the variable maxLength.

###OR
```
function findLongestWordLength(str) {
  let words = str.split(" ");
  let longest = "";
  for (let word of words) { // <-----
    if (word.length > longest.length) {
      longest = word;
    }
  }
  return longest.length;
}

findLongestWordLength("The quick brown fox jumped over the lazy dog");
```
* Here instead of the for loop that loops through the indexes we loop through the elements themselves.
Your Angular code base is deprecated.
Tags: angular, javascript, typescript, decorators
Published: 2021-05-27 23:27:40

No, upgrading to Angular 12.x.x will not help.
It's still deprecated.

The Typescript experimental decorators were based on [TC39 proposal-decorators](https://github.com/tc39/proposal-decorators).

We use the same Decorators in our Angular codebase to create services, components and other Angular constructs.

But the same TC39 proposal has evolved in a different direction which is semantically not compatible with the experimental Typescript decorators.   

The new spec for Decorators is easier to use and write.
This draft is still in stage-2 and may again change in the future.

You can find the detailed comparison between old and new decorators [here](https://github.com/tc39/proposal-decorators#comparison-with-typescript-experimental-decorators). 

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Just finished up the first draft of the new decorators spec, pretty excited about it 😄 <a href="https://t.co/ELhZbsiaiR">https://t.co/ELhZbsiaiR</a></p>&mdash; The p is silent (@pzuraq) <a href="https://twitter.com/pzuraq/status/1397716184867295232?ref_src=twsrc%5Etfw">May 27, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Does this mean that Typescript experimental decorators will not be compatible with Javascript decorators 😨</p>&mdash; Shivam (@Shivamd20) <a href="https://twitter.com/Shivamd20/status/1398043762664693760?ref_src=twsrc%5Etfw">May 27, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Unfortunately no, the new proposal has differing semantics from previous proposals in a number of ways. TypeScript experimental decorators were also incompatible with the Define semantics class fields, which caused a decent amount of breakage in the ecosystem.</p>&mdash; The p is silent (@pzuraq) <a href="https://twitter.com/pzuraq/status/1398044922645671936?ref_src=twsrc%5Etfw">May 27, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet"><p lang="en" dir="ltr">When the proposal advances, figuring out a step-by-step incremental upgrade path for existing decorators users is definitely going to be a priority though! No user left behind 😄</p>&mdash; The p is silent (@pzuraq) <a href="https://twitter.com/pzuraq/status/1398045108805640195?ref_src=twsrc%5Etfw">May 27, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


Let's just hope that this doesn’t result in fragmentation of JavaScript decorators. We have already faced a lot inconvenience due to [commonsjs and ES6 imports](https://stackoverflow.com/questions/52567493/why-node-uses-require-not-import).
Build an idea generator from scratch, part 1: Project setup with Github and dotenv [Video]
Tags: video, javascript, tutorial, codenewbie
Published: 2021-05-28 01:32:45

{% youtube TqdmUdi8xbY %}

So as I was finishing up teaching my web development class last year, I really wanted to give my students something to help them continue growing and learning. I decided to build an idea generator with HTML, CSS, and JavaScript using the [raindrop.io API](https://developer.raindrop.io/), and now, I’m finally getting around to posting the process recordings. Woohoo! I’ll be posting a new recording each week. 

In this first part of the tutorial, we'll set up a Github repository, get our template code set up, and install dotenv, a library which will help us make an authenticated call to the API securely. You'll also see your first introduction to Git Flow. I use Tower to make things a little easier, but you can use any method of interacting with git you like. This would be a great intermediate JavaScript challenge for someone looking to practice ES6 syntax! 

## This video covers:
- How to set up a new repository in Github using a template
- How to clone a remote Github repository to your computer
- How to use Git Flow to create a feature branch
- How to make an authenticated call to an API using JavaScript
- How to use dotenv to store access tokens and other sensitive information in your app without committing it to your codebase

... and so much more!

## The final product

In this series, we’ll be working toward [this idea generator](https://professorkolodziej.github.io/idea-generator/) as our final product.

## Code links

Follow along by cloning or forking the main branch here: https://github.com/ProfessorKolodziej/idea-generator

You can also start on your own project by using my Student Site Boilerplate template: https://github.com/ProfessorKolodziej/student-site-boilerplate/

**[Catch the new video over here.](https://youtu.be/TqdmUdi8xbY)** Happy coding!

---

**I'm always happy to connect!**

🐰 [@ashleykolodziej on Twitter](https://twitter.com/ashleykolodziej)
🐰 [Subscribe to Professor K Explains on YouTube](https://www.youtube.com/c/ProfessorKExplains?sub_confirmation=1)