teleren/devto huggingface dataset:
Lazy Initialization
Tags: beginners, computerscience, java
Published: 2021-09-19 22:29:12

While searching on Stack Overflow for solutions to problems, I notice certain terms and phrases that are mentioned frequently.  One of the most common I see is lazy initialization.  ***Why would we want anything to be lazy?***  Lazy initialization in a nutshell is the idea of delaying initialization of an object until later when it is needed.  When an application creates many objects, taxing operations performed by each object can add up.  If you don’t need those operations right away then why would you perform them immediately and bog down the system?

```
public class LazyInit {

	private static Resource resource;

	public static Resource getResource() {
		if (resource == null) {
			resource = new Resource();
		}
		return resource;
	}
}
```
Using a code snippet taken from an article published by Maciej Najbar, you can see an example for a single thread implementation.  For those that have used the Singleton design pattern this may look familiar.  The class creates a placeholder for the Resource object name resource.  Using the getResource() method the object is checked to see if it has been initialized with a value or is null.  If null, it is then assigned with a value which is returned otherwise it just returns the value already assigned.  This allows the programmer to create conditions on when the initialization occurs with the getResource() method rather than in the constructor at object creation.

Examples on when it may pay to be lazy

- Loading images in a web application
- Java Spring Boot Beans
- Database connections
- Blog posts

As with everything there are some downsides to consider.  Lazy loading is more taxing on the system than just initializing the object.  This is why everything isn’t implemented that way.  Some systems may need these objects to be created right away to be configured correctly.  Also, it may be harder to debug since errors or exceptions won’t be thrown until initialization.  As with anything in programming there are both pros and cons to consider before implementing.  Make sure to weigh the costs on the system before adding a lazy loading to your application.

Resources:

1. Najbar, M. (2019, January 23). Lazy initialisation - what's a correct implementation? Medium. Retrieved September 19, 2021, from https://medium.com/android-news/lazy-initialisation-whats-a-correct-implementation-64c4638561e.

2. Maayan, G. D. (2020, December 25). Don't be LAZY: 3 problems with lazy loading and when to use eager loading. Hacker Noon. Retrieved September 19, 2021, from https://hackernoon.com/dont-be-lazy-3-problems-with-lazy-loading-and-when-to-use-eager-loading-qq1d34cl.
Set Neovim and Using Meta key in VSCode
Tags: vscode, neovim, vim, metakey
Published: 2021-09-19 22:23:21

---
title: Set Neovim and Using Meta key in VSCode
published: true
description: Setup for using Neovim and Meta key in VSCode
tags: vscode,neovim,vim,metakey
//cover_image: https://direct_url_to_image.jpg
---
### Set Neovim mode in VSCode
  - Install VSCode Extension: [VSCode Neovim](https://github.com/asvetliakov/vscode-neovim)

### Mapping meta key for VSCode and Neovim
- Unification of meta key mapping between VSCode and Neovim
- Send meta key mapping from VSCode to Neovim
- Example of meta key for moving text
  - VSCode Meta Key(\<M-h/j/k/l\>) --> Neovim Meta Key(\<M-h/j/k/l\>)

##### VSCode: keybinding.json(Shift-Cmd-P)
```json
{
    "command": "vscode-neovim.send",
    // the key sequence to activate the binding
    "key": "M+k",
    // don't activate during insert mode
    "when": "editorTextFocus && neovim.mode != insert",
    // the input to send to neovim
    "args": "<M-k>"
},
{
    "command": "vscode-neovim.send",
    // the key sequence to activate the binding
    "key": "M+j",
    // don't activate during insert mode
    "when": "editorTextFocus && neovim.mode != insert",
    // the input to send to neovim
    "args": "<M-j>"
},
..
```

##### init.vim
```vim
" Normal Mode
nnoremap <M-K> <CMD>m .-2<CR>
nnoremap <M-J> <CMD>m .+1<CR>
nnoremap <M-H> <<
nnoremap <M-L> >>  
" Visual Mode
vnoremap <M-K> :m '<-2<CR>gv
vnoremap <M-J> :m '>+1<CR>gv
vnoremap <M-H> <gv
vnoremap <M-L> >gv 
```

### Terminal emulator for meta key
- To send the meta key, you need to set the meta key in the terminal emulator.
  - Mac: Terminal --> Preference --> Profile --> Key Board --> Enable "Use Option as Meta key"
  - Emulator using xterm.js.  
ttyd(macOptionIsMeta=true)/hyper(altIsMeta: true) Find and set the corresponding Option
LEVEL UP with JavaScript! LVL 7
Tags: javascript, webdev, beginners, tutorial
Published: 2021-09-19 20:22:55

### In this blog series tutorial, I will be covering some of the basic JavaScript programming concepts.

This is geared toward beginners and anyone looking to refresh their knowledge.

### See the [<strong>Previous Level Here</strong>](https://dev.to/devcronin/level-up-with-javascript-lvl-6-17ff)

Level 7 will cover: 

* Store Multiple Values in One Variable Using JavaScript Arrays
* Nest One Array Within Another Array
* Access Array Data With Indexes
* Modify Array Data



## Store Multiple Values in One Variable Using JavaScript Arrays

Multiple values can be stored together by enclosing them with brackets []. 
These can be any combination of strings and/or numbers.


```JavaScript

let myArr = ["Natural", 20];

```

## Nest One Array Within Another Array

Nesting arrays within another array is also possible by using brackets inside of brackets. 
This is referred to as multi-dimensional array.

```JavaScript

let multiDimensionalArray = [
    ["Hit points", 30], 
    ["Damage", 15]
];

```

## Access Array Data With Indexes

Indexes are a way to reference and then access data inside of an array.
They use brackets and specify an entry in an array. 
Arrays use Zero-based indexing (starts the count from zero).

```JavaScript

let diceArray = [2,5,6,4,1,1];

diceArray[3];

// 4

```

## Modify Array Data

The entries of arrays are able to be changed, and this is referred to as mutable.

```JavaScript

let diceArray = [2,10,8,7];

diceArray[0] = 4;

diceArray[0];

// 4

// Now the 2 in our array is 4

```




### Thank you for reading my blog! This is the seventh of my series on JavaScript so if you would like to read more, please follow!

### See the [<strong>Next Level Here</strong>](https://dev.to/devcronin/level-up-with-javascript-lvl-8-2egc-temp-slug-1226361)


## [<strong>Support and Buy me a Coffee</strong>](https://www.buymeacoffee.com/ZachCronin)
Six ways to use data binding with Vue.js
Tags: computed, binding, vue
Published: 2021-09-19 21:44:27

---
title: Six ways to use data binding with Vue.js
published: true
date: 2021-09-19 21:37:13 UTC
tags: computed,binding,vue
canonical_url: https://blog.jws.app/2020/four-ways-to-use-data-binding-with-vue-js/
---

This is going to be a pretty quick post.  This week, I figured that we would look at computed properties and methods.

{% codepen https://codepen.io/steinbring/pen/vYOgpVd %}

In the above example, we are taking [Date.now()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now) and outputting it to the screen four ways:

- 
  - Directly as `{{Date.now()}}`
  - As the variable `time`
  - As a computed value
  - As a method

What is the functional difference between them?  In this case, very little. 🙂

So, what if we bind to our component’s data instead of to `Date.now()`?

{% codepen https://codepen.io/steinbring/pen/rNVyyaR %}

So, now the value can actually update? 🙂

Please note, this is a republishing of a [post that I wrote early last year](https://blog.jws.app/2020/four-ways-to-use-data-binding-with-vue-js), so please don't be too harsh.
Russian Peasant Multiplication
Tags: python, programming, algorithms, computerscience
Published: 2021-09-19 21:04:53

![Console Output](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8zehees7pu0he9w5di28.png)
```python
# rpm.py
#   This program uses the "Russian Peasant Multiplication" algorithm
#   to solve for multiplication through binary expansion.
# by: Scott Gordon

import math
import pandas as pd

def main():
    print('***** Russian Peasant Multiplication *****')
    def rpm():
        print('Input two comma separated numbers (x, y): ')
        input_str = input('> ')
        inputs = input_str.split(',')
        n1, n2 = int(inputs[0]), int(inputs[1])

        halving = [n1]
        while(min(halving) > 1):
            halving.append(math.floor(min(halving)/2))

        doubling = [n2]
        while(len(doubling) < len(halving)):
            doubling.append(max(doubling) * 2)

        half_double = pd.DataFrame(zip(halving,doubling))
        rpm_out = half_double.to_markdown()
        print('\n*** RPM Table ***')
        print(f'{rpm_out}\n') # requires tabulate for md
        half_double = half_double.loc[half_double[0]%2 == 1,:]

        answer = sum(half_double.loc[:,1])
        print(f'The solution to your problem is {answer}\n')

    rpm()

if __name__=='__main__':
    main()
```
Photo by <a href="https://unsplash.com/@lapyrin?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Ivan Lapyrin</a> on <a href="https://unsplash.com/s/photos/russian-peasant?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
The Odin Project – 2 weeks in
Published: 2021-09-19 20:39:19

For the past two weeks, I have been learning through The Odin Project starting with their foundations course. I already know the fundamentals of HTML and CSS, however I figure it is good to review it from time to time.

After the first week actually, I had finished the HTML/CSS portions, mainly since I had just recently completed freeCodeCamp’s HTML/CSS course (again, for review), and had started the JavaScript portion of Foundations. At that moment, The Odin Project released a slew of new content for HTML/CSS and advised that it would be good to go back and complete the new exercises. Needless to say, the JavaScript portion has been put on hold until I finish the review.

The new HTML/CSS content for The Odin Project is really good, and I’m glad I’m going back through it. While it has separated itself more from freeCodeCamp, I find these new exercises and links are just as good at teaching HTML and CSS. What’s more, the new projects have made me practice the Git lessons I had learned previously – where the old lessons using freeCodeCamp didn’t require Git. If you want to feel awesome while creating a basic recipe site by using VS Code, the terminal, and Git, the new content covers it!

I do find that I don’t use The Odin Project’s discord channel very often, and in fact I muted the notifications. There is no shortage of activity on the discord channel, however I feel like it’s over-crowded at this point. I try to jump on there a few times a week to review someone else’s HTML project or post something I’ve done, however it’s very crowded and digitally “loud.” It is good when you want code reviews or troubleshooting, since you are almost guaranteed to get someone quickly if you post in the correct channel. But if you are looking for a community to meet people and develop relationships, I feel like this discord server is too big at this point. I have found another smaller community on Discord to interact with more.

This week I plan to speed up a bit and finish out the CSS portions of the lessons so I can properly get to the JS section and finish Foundations. I’m shooting to finish Foundations by Thanksgiving, then get to the Ruby/Rails/JS track. I’ve been taking some notes on CSS tricks I hadn’t learned previously on fCC, and I’m curious to see how the Grid and Flexbox lessons compare to freeCodeCamp’s.

I’d love to hear about what you’re learning this week – feel free to comment below with your focus!
python challenge_6
Tags: python, programming, webdev, challenge
Published: 2021-09-19 19:43:34

###Adding and removing dots

###level of challenge = 3/10

- Write a function named add_dots that takes a string and adds "." in between each letter. 
- For example
- calling add_dots("test") should return the string "t.e.s.t".

- Then, below the add_dots function, 
- write another function named remove_dots that removes all dots from a string.
- For example
- calling remove_dots("t.e.s.t") should return "test".

- If both functions are correct,
- calling remove_dots(add_dots(string)) should return back the original string for any string.

Hint

- For add_dots you may find the string join method useful.
- If you don't want to use it, 
- You can instead iterate over each letter in, 
- The input while building up a result string that is initially empty.

- The remove_dots function is similar. 
- Either use the string replace method or manually loop over the letters, 
- keeping ones that aren't ".".

####My solution

```
def add_dots(string):
    new_string = ".".join(string)
    return new_string
print(add_dots("test"))

def remove_dots(string):
    new_string = string
    result = new_string.replace(".", "")
    return result
print(remove_dots("t.e.s.t"))
 
print(remove_dots(add_dots("tito")))
```

####Another solution
####the longer way

```
def add_dots(s):
    out = ""
    for letter in s:
        out += letter + "."
    return out[:-1] # -> do not show the lest dot 

def remove_dots(s):
    out = ""
    for letter in s:
        if letter != ".":
            out += letter
    return out
```
####the short way

```
def add_dots(s):
    return ".".join(s)

def remove_dots(s):
    return s.replace(".", "")
```

Add your solution in the comment :)
CIA Triad
Tags: cybersecurity, confidentiality, availability, integrity
Published: 2021-09-19 19:30:34

The CIA triad is the major, common and basic principle that is used for the development of security systems, policies, and procedures. It is also used to identify threats or vulnerabilities and provides effective solutions. CIA triad plays a vital role in the daily routine processes and security of an organization.
![alt text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n5e9vx49nn661o4vc9ub.png)
	     Definition of CIA Triad in Examples.

Confidentiality: Confidentiality means to keep something private and secret. Suppose I have given you a book and if no one knows that I have given you that book and the book is with you. Then the confidentiality of the book is not compromised.

Integrity: Integrity is defined as, no one should have access to the book to edit, modify and misplace the book. If the book is misplaced, edited, stolen, or copied then the integrity of the book will be compromised.

Availability: Availability is defined as, whenever the book is required it must be available for use or studying purposes for the authorized personnel. If not then the availability of the book is said to be compromised. 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rufaes20p3cuya4f8v79.png)

You may assume the book as data. Data and information are the most valuable assets for the organization. If the CIA triad is not implemented on the data then the data is not safe.
Making the most boring website ever with TypeScript, NestJs, React and others. Part 1.
Tags: react, typescript, node, webdev
Published: 2021-09-19 19:28:35

## What is this

So I'm making a series of videos on how to build a very basic website for a local business. In my case it's a website for a barbershop with an admin panel and a reservation booking form. And today I released the first part.

This video is a bit different from others, since it's not really a follow along tutorial with explanations for every single line. My goal was more to show how different technologies work together. And I only tried to explain stuff that I find interesting or things that are not usually in the docs or not that easy to google.

The other reason for that is I'm myself is getting a bit tired of those 4000hrs videos of people making typos. So the main goal of this video was to be slightly more fun, even if it was at the cost of being less informative.

Anyway, you can find the video here: 

{% youtube b_QDY1UIT7Y %}

I hope some of you will enjoy it.

## Stack

For people that are interested in particular technologies/libraries, here is the tech stack i used so far:
- Typescript
- NodeJs
- NestJs
- Prisma
- PostgreSQL
- React
- Styled-components.
- React-query
- Formik

## Promo tips

A couple of tips from the video with a hope of making you curious enough to watch it.

### Debugging NestJs app in VS Code

If you try to debug a NestJs app in VS Code just by pressing the Debug button (or F5), you might run into some issues, since it may conflict with how the app is supposed to be built. 

There is much easier way. You just need to set the **Auto Attach** option to **Smart** (you can do this with the Command Palette), and then run the app with `yarn start:debug` (`npm run start:debug`). And that's it, when the application starts, the magic of VS Code will show itself and debugger will run and attach itself to the process.

### Thunder Client

If you're a bit tired of how bloated Postman may feel sometimes, there is a VS Code extension called [Thunder Client](https://www.thunderclient.io/). It supports pretty much all you need for testing your APIs.

### Readable class names with styled-components
By default the class names generated by styled-components are gibberish like `.frh743-Wrapper`. If you want them to be more meaningful, you can update your babel configuration according to the [docs](https://styled-components.com/docs/tooling#better-debugging). 
The problem is, you can't really do this if you use something like **create-react-app**. Luckily, there is another solution. You just import the library a bit different and it should work.
```
import styled from 'styled-components/macro'
```
ConvertBox Review - Lead Generierung mit SaaS Tool
Tags: onlinemarketing, formular, lead, newsletter
Published: 2021-09-20 08:25:26

---
title: ConvertBox Review - Lead Generierung mit SaaS Tool
published: true
date: 2021-09-19 19:08:24 UTC
tags: OnlineMarketing,formular,lead,newsletter
canonical_url: https://bloggerpilot.com/convertbox/
---

![ConvertBox Review](https://bloggerpilot.com/wp-content/uploads/2021/09/convertbox-review.png)

Unter Lead-Generierung versteht man die Gewinnung neuer Kunden, Leads oder Interessenten. Es ist ein legitimer Weg, um online Geld zu verdienen. Egal, ob du auf StumbleUpon, Reddit, StumbleUpon, berühmten Blogposts oder einer anderen berühmten Seite bist, du kannst mit Leads Geld verdienen.

Die Konversion ist ein sehr wichtiger Teil jeder Kampagne zur Leadgenerierung. Wenn deine Landing Page konvertiert, bedeutet das, dass sie den Besucher dazu bringt, die gewünschte Aktion auszuführen.

ConvertBox ist ein Lead-Generierungs- und Popup-Tool, mit dem du Kontaktinformationen sammeln, E-Mails versenden und eine Beziehung zu deinen Besuchern aufbauen kannst. Es ist ein großartiges Tool, um deine Website zu bewerben.

Die Erstellung von mehrstufigen Formularen mit Convertbox Software ist keine leichte Aufgabe für jeden, der kein Experte in der Gestaltung von Formularen ist.

Ich habe den Convertbox-Blog auf der Convertbox-Website erstellt, um den Kunden zu zeigen, wie sie die Software nutzen können, um ihre eigenen Kampagnen zur Leadgenerierung zu erstellen.

Der Original-Artikel erschien auf [ConvertBox Review - Lead Generierung mit SaaS Tool](https://bloggerpilot.com/convertbox/).

Zusammenfassend lässt sich sagen, dass Convertbox ein gut durchdachtes Tool zur Steigerung der Website-Konversionen ist. Die Funktionen sind einfach zu bedienen, bieten aber eine breite Palette an Anpassungen und Designs, die zu jeder Website oder jedem Blog passen. Das Tool wurde entwickelt, um die Konversionsrate zu erhöhen, ohne dass dabei die Ästhetik auf der Strecke bleibt.
What is Cybersecurity?
Tags: cybersecurity, security, websecurity, datasecurity
Published: 2021-09-19 19:07:30

The process of utilizing all the policies and protocols to stop or minimize the Cyber crimes is referred as Cybersecurity. 

Nowadays, Cyber-crimes are quite common these days. All such organizations that are storing their data in the information systems are at risk. The information systems include computers, mobiles, laptops, etc, and all of these devices are connected to the internet via wireless, Ethernet, or by any other means. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f0iivz2c2q7pszu03efo.jpeg)

With every passing minute there is a security issue related to these systems because their confidentiality, integrity and availability is very important.
	
The world is progressing rapidly but still the Cyber crimes are quite common. There is no system in the world that is 100% secure. So we are supposed to work in this domain to protect our system from every sort of attack and this is not possible without Cybersecurity.
Astro Command unlocks the world
Tags: astro, python
Published: 2021-09-19 19:04:43

---
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q4mc0exzrftcm2z9971o.jpg
---
## Introduction
This weekend I built a new [Astro](https://astro.build/) component that lets callers use external commands on their machine to generate html content.

{% github trashhalo/astro-command no-readme %}

In the repository there is a hello world demo that is shelling out to python.
```typescript
---
import { Command } from "astro-command";
---
<Command caller={import.meta.url} command="./Component.py" message="from python!" />
```
```python
#!/usr/bin/env python 

import sys, json

data = json.load(sys.stdin)
print(f'<h1> Hello {data["message"]} </h1>')
```
Props are passed in as a json blob to stdin. Html comes out stdout.

## Taking it up a notch
Python has a very deep well of libraries that can be useful for astro page generation. One example is https://matplotlib.org/ a plotting library that can generate beautiful graphs outputting SVG.

As a quick example I rewrote the hello world py component to output a graph instead.

![Screenshot 2021-09-19 144501](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q4mc0exzrftcm2z9971o.jpg)

{% gist https://gist.github.com/trashhalo/bf0b5d54245748f48b6a2e58c1498a41 %}

## Its not just python
Now that you have shell access from Astro you can use any command! The first one I created a custom component for is Pandoc to get access to all the types of content Pandoc can understand. With 12 lines of astro code I unlocked 30+ file formats!

{% github trashhalo/astro-pandoc %}

## Whats next?
There are lots of commands out there. Which one should I connect to astro next?
Adding captions to images in MDX
Tags: mdx, react, caption
Published: 2021-09-19 18:41:53

Using [MDX](https://mdxjs.com/) you can overwrite the default components that are provided by Markdown. In this blog I will use this to add captions to images.

The first thing to do is to look at the [table of components](https://mdxjs.com/table-of-components) for MDX, and here we can see that images are represented by `img`. By following the link we can see the markdown

```markdown
![alpha](https://example.com/favicon.ico "bravo")
```

Yields the following items

```javascript
{
  type: 'image',
  url: 'https://example.com/favicon.ico',
  title: 'bravo',
  alt: 'alpha'
}
```

To adapt this component, we are going to use `title` as the caption

Then we create a React component, where each of the keys are passed inside props

```jsx
function MyImg(props) {
  if (props.title !== undefined) {
    return (
      <figure>
        <img src={props.src} alt={props.alt} />
        <figcaption>{props.title}</figcaption>
      </figure>
    );
  } else {
    return <img src={props.src} alt={props.alt} />;
  }
}
```

A conditional statement is used here so that no excess formatting is introduced if no title is present. The standard figure layout is used as a tag is there specifically for captions

You can then pass this component to MDX in the method detailed [here](https://mdxjs.com/getting-started/#working-with-components) and the captions should not display themselves. You can then apply CSS or classes to the HTML tags in order to style it as you want.