teleren/devto huggingface dataset:
How to access Kaggle data from command line
Tags: kaggle, python
Published: 2022-11-20 17:46:48

The war isn't going anywhere for now, so every couple of days I have to do the following steps to update [Russian losses tracker](https://taw.github.io/open-source-adventures/episode-51/):

* [download zip from Kaggle](https://www.kaggle.com/datasets/piterfm/2022-ukraine-russian-war?resource=download)
* [run `update_csv` script](https://dev.to/taw/open-source-adventures-episode-38-update-script-for-russian-losses-app-52lk)
* optionally, verify that data looks right with `git diff`, as occasionally there's a typo which makes losses go backwards (it happened only a few times, and it always gets corrected in the next update)
* delete `archive.zip`

The annoying part is that Kaggle requires me to be logged in in a browser to download data, so I can't just replace that step with a `curl` request.

So let's try to improve this flow a bit.

### Get Kaggle API token

You need to create an account on Kaggle.

Then go to your account settings by clicking on top right icon, and selecting Account (`https://www.kaggle.com/<name>/account`).

There's "Create New API Token" button, which will create new account token, and download it as `kaggle.json`. Create `~/.kaggle` folder, and save that file to `~/.kaggle/kaggle.json`.

Kaggle will complain if you don't secure the file so run this: `chmod 0600 ~/.kaggle/kaggle.json`

### Install Kaggle CLI tools

If you have Python3 installed, you just need to do `pip3 install kaggle`

### Download dataset

User name and ID of the data set are in the URL, so to download `https://www.kaggle.com/datasets/piterfm/2022-ukraine-russian-war` you need to run:

```
$ kaggle datasets download piterfm/2022-ukraine-russian-war
```

It will save it as `2022-ukraine-russian-war.zip`. There are extra options like where you want to download it, or unzipping it etc.

### Full process

Now I can automate the whole process:

```
$ kaggle datasets download piterfm/2022-ukraine-russian-war
$ ./update_csv 2022-ukraine-russian-war.zip
$ trash 2022-ukraine-russian-war.zip
$ git add -u
$ git ci -m 'Data Update'
$ git push
```

And since it's just a series of commands, I can even make it run automatically every day, without any intervention.

I could also add some kind of data checks to the process, so if there's anything weird like numbers going backwards, it would stop the update and wait for the next day. But overall, I'm happy with how it all ended up.
Day 49 / 100daysofcode
Tags: 100daysofcode, nextjs, webdev, markdown
Published: 2022-11-20 17:45:32

I didn't like how limited the customization options were. When I was using dev.to, I liked markdown because of how easy it was to use. So, I want to add it to the website to that there could be better descriptions of the ideas.

I spent today making a note app to see how Markdown would work with Firebase database. The experiment was successful because I was able to add it to the website and it was formatted correctly, from spacing to the content.

Along with making a Markdown notetaking app, I realized that problem that kids my grade and myself had was Quizlet writing mode. In french class, I remembered when I used to use Quizlet to practice writing french words but after they started charging for it. I decided that I would make it myself. This will help me a lot for my classes that require memorizing terms.

I plan to add this to the website later. The goal is for the website to be completely finished from the backend to the front end by Summer 2023.
Smooth cross-team collaboration is the top thing to do to amplify career growth in this hybrid work era
Tags: career
Published: 2022-11-20 17:45:21

Smooth cross-team collaboration is the top thing to do to amplify career growth in this hybrid work era. Eyeing that promotion or applying for a dream role? Go beyond being just a good team player with these ABCDEs:

## Appreciation
A simple "thank you Roger" on that slack channel goes a long way in fostering a great cross-team relationship. A direct message to your peers' manager with what/how they helped you will go even further.

## Borrow credibility 
It is extremely difficult to build relationships and hence - credibility with every stakeholder you work with. Feel free to borrow your teams/manager's/mission's credibility. And then work extremely hard to keep it, and also to expand on it.

## Communicate clearly 
The focus should be to be clear, not clever when talking to people with whom we do not interact often. Have a framework in mind when you set meetings - a good option is the "Purpose, Process & Payoffs" model. Pay special attention to setting context when messaging / emailing people.

## Demonstrate leadership without direct authority 
This is the "skill" to develop to rally the peers, the people who do not report to you, and the people within different teams around a common goal.

##Empathy
Realizing the fact that every colleague of yours will have different and multiple motivations to achieve goals and will hence pursue each task with a different intensity.

These are the top things that come to my mind when thinking about cross-team collaboration with the amazing colleagues I work with at Sysdig and its partners. What are some things on top of yours?
Kotlin Springboot -- Part 16 usecase の単体テスト (UT) を作る。port 以降は mockk を使う。
Tags: kotlin, ca
Published: 2022-11-20 16:41:39

# 実装と方針

---

## 実装コード

```kotlin
@Component
class PersonsUsecase(
  private val personPort: PersonPort,
) {
  fun getAllPersons():Persons {
    return personPort.getAllPersons()
  }
```

テストをする対象のコードはこれ
At Component で外部から使えるようにして
同じく At Component で外部から使えるようになっている
Port とその先の Gateway の getAllPersons を呼んで
Persons ドメインで受け取って、そのまま Rest に返す。

---

## 方針

TDD をやりたい。だから単体テストを先に書く。

実装のように Gateway のインスタンスをそのまま呼び出して使うと
Usecase の単体テストなのに、Gateway も同時にテストすることになってしまう。

それは Clean Archtechture な TDD ではない。
Rest のテストが通って、Usecase のテストが通って、そのあとに Gateway を実装したい。

なので Gateway を呼び出すための Port を mockk を用いてモックにする。

---
---

# 単体テスト

---

## 実際にやること

Port の偽物の中身を読んだ時にできる想定物と
Usecase の中身を読んだ時に成果物
これらが同じか比較する。

---

## 単体テストコード全体

```kotlin
import io.mockk.*
import org.amshove.kluent.shouldBeEqualTo
import org.junit.jupiter.api.Test

class PersonsUsecaseTest {
    @Test
    fun `全てのPersonを取得する`() {
        val persons = mockk<Persons>()
        val personPort = mockk<PersonPort>()
        val target = PersonsUsecase(personPort)
        every { personPort.getAllPersons() } returns persons
        val actual = target.getAllPersons()
        actual shouldBeEqualTo persons
    }
}
```

---

## 関数はじめと返り値のモック

```kotlin
    @Test
    fun `全てのPersonを取得する`() {
        val persons = mockk<Persons>()
```

At Test でテストコードだということを明記。
mockk で Persons 型の偽物インスタンスを作成。これは単純。

---

## Port のモックの中身を呼び出す

同じく mockk で PersonPort 型のインスタンスを作成する。
しかし、これは中身のメソッドを呼び出されることになる。

```kotlin
val personPort = mockk<PersonPort>()
target.getAllPersons()
```

たとえばこのまま mockk の偽物の中身を実装と同じ用に呼び出すと

```error
no answer found for: PersonPort(#2).getAllPersons()
io.mockk.MockKException: no answer found for:
PersonPort(#2).getAllPersons()
```

PersonPort は mockk で作られた偽物である。
なので中身が呼び出せない。MockKException が起きる

---

## Port のモックの中身を呼び出した時に何が返ってくるか決める

```kotlin
every { personPort.getAllPersons() } returns persons
```

ここで every { mockPort.functionName() } returns expectedMockName を使う。

すると {} 内部で Port のモックの中身の関数が呼ばれた時に
returns の後ろに書いた期待されるモックを返すようになる。

---

## usecase として本体のインスタンスを呼び出す

```php
val target = PersonsUsecase(personPort)
```

mock の port を usecase のクラスに渡してインスタンス化する。

Usecase 自体をモックにするのは次回。

---

## まとめ

Usecase の UT を書くには

```kotlin
@Test
fun `シナリオ名`() {
```

と書き始めて

返り値の型の Domain のモックを用意。
内部で使われる Port のモックを用意。

every {} return で Port のモックの使用される関数が呼ばれた場合
Domain のモックが返されるように設定する

Port のモックを使って Usecase のインスタンスを作る

usecase のインスタンスの使用される関数が呼ばれた場合
Port のモックの中身が呼ばれた場合と同一結果になるか比較する。

以上。

---

## 次回

Usecase も本物に限りなく近いモックを用意してテストするようにする。
initLogs 5: Why write simple code?
Tags: programming, writing, productivity
Published: 2022-11-20 16:41:29

I recently read a reddit post. I was about someone who's colleague writes complex code over simple code. Unnecessarily I should add. At least as per the post. But that is when it struck me. The reason for writing simple code is the same as it is for simple writing. 

One of the best advices I got about writing was to write simple. You write simple and consumable sentences instead of using fancy words and complex sentences. This helps more readers understand what you are trying to convey. Good writer's work will seem easy to consume. Like [Paul Graham](http://paulgraham.com/articles.html) who writes about complex topics. Yet looks so simple. It is not simple. But one reason his writing seems easy is because it is simple.

This is exactly why we should be writing simple code as well. Irrespective of your developer experience. Writing simple code wherever possible helps other people understand it better. Cuts down the debugging time. Writing complex code all the time doesn't make you smart. Just inefficient. Not just for others, but for your future self. When you go back to a simple codebase in future, you would understand it better, debug faster and have less head scratches.

In short, write simple code wherever possible.
How to upgrade the Laravel Breeze on the existing application
Tags: laravelframework, laravel, php, webdev
Published: 2022-12-22 02:05:43

---
title: How to upgrade the Laravel Breeze on the existing application
published: true
date: 2022-11-20 16:31:47 UTC
tags: laravelframework,laravel,php,webdevelopment
canonical_url: https://blog.devgenius.io/how-to-upgrade-the-laravel-breeze-on-the-existing-application-8f742b48b632
---

[![](https://cdn-images-1.medium.com/max/992/1*Qz3f9FOH0nB3LVa76Z9mNQ.png)](https://blog.devgenius.io/how-to-upgrade-the-laravel-breeze-on-the-existing-application-8f742b48b632?source=rss-17217f29618a------2)

Laravel creates an admin panel from scratch — Part 17

[Continue reading on Dev Genius »](https://blog.devgenius.io/how-to-upgrade-the-laravel-breeze-on-the-existing-application-8f742b48b632?source=rss-17217f29618a------2)
Kotlin 基礎 Part 7 -- DI ( Dependency Injection ) コンテナへの登録 / 使用
Tags: kotlin, di
Published: 2022-11-20 16:19:40


## 参考

https://www.amazon.co.jp/gp/product/B091PGXHJY/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1

Kotlin サーバーサイドプログラミング実践開発

第4章 3 Springboot の DI  を使用する

から。

---

## DI とは

書籍によると、クラスで使用するオブジェクトの生成の自動化とある。

オブジェクト生成の自動化はインスタンス作成の自動化だ。

ここでの依存性注入は、自動で(初期読み込み時に)他のクラスのインスタンスを作ってあるクラスで使えるようにする仕組みだと解釈した。

https://www.w2solution.co.jp/tech/2021/10/06/eg_ns_rs_izonseinotyunyu/

この記事によると、オブジェクト(実装)の注入という。

---

## @Component / @Named

どちらも DI コンテナに登録するもの。

DI コンテナとは、Spring App の起動時に読み込まれて固定される
React のグローバルステートのようなものだと解釈する。

https://qiita.com/asksaito/items/2c854065e5803463ebfd#コンポーネントスキャンの対象

この記事によると、Component も Named も機能は同じで
Spring のものか Java のライブラリのものかでしか無いようだ。

---

## @Autowired @Inject

https://dawaan.com/autowired-vs-inject/

これらは DI コンテナから持ってきてそのクラス内部で使えるようにするもの。

上記と同様に Spring か Java のものかで、機能は同じ。

Mockk では InjectMocks を使って偽物としてインスタンス作成できる。
Website Snowfall Effect
Tags: javascript, css, svg
Published: 2022-11-20 14:38:09

https://github.com/ahmetilhan24/snow-fall-effect
# Snow Fall Effect

_It provides a realistic snowfall effect to your site to make your websites look more aesthetic during the winter months._

## Insatalation

##### HTML File

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!--import inside head tag-->
    <script src="../dist/index.js" type="module"></script>
  </head>
  <body>
    <!--Call it snowfall here too.-->
    <script type="module" defer>
      import SnowFall from "../dist/index.js";
      new SnowFall();
    </script>
  </body>
</html>
```

##### Vue

```js
import SnowFall from "snow-fall"
export default {
  data() {
    return {
      msg: 'foo'
    }
  }
  mounted() {
    new SnowFall();
  }
}
```

## Configuration

##### Types

```js
{
  sizeRange: [number, number],
  color: string,
  speed: number,
}
```

```js
new SnowFall({
  sizeRange: [10, 20], // default (min 0)
  color: "#fff", // default
  speed: 10, // default (second)
});
```

_*Coded by ahmetilhan*_
Outsystems NextStep 2022 – what you need to know
Tags: outsystems, nextstep, lowcode
Published: 2022-11-20 14:21:05

**This week Outsystems held its annual conference, NextStep. It’s that moment that new features are revealed and best practices are showcased. I have attended the hybrid viewing party in Utrecht, the Netherlands. In the case you missed it, I’m happy to give you a recap of the highlights.**

This post originally featured at my [own blog](https://jan-wagenaar.nl/blog/outsystems-next-step-2022-what-you-need-to-know).

### Project Neo starts to become reality
Last year, Outsystems announced Project Neo, which was said to “redefine developer productivity”. However, the details remained scarce. This year Outsystems finally shared more. First of all, Project Neo will now be called [Outsystems Developer Cloud (ODC)](https://www.outsystems.com/low-code-platform/developer-cloud/). It will be build on an AWS cloud infrastructure. Apps will run in their own container, which is based on Kubernetes. This enables scalability. If demand increases, Kubernetes is able to spin up new instances. It makes it also faster for instances to deployed. It’s hard to draw conclusions from the demo’s on NextStep, but deployments seemed faster. One-Click Publish however seemed to take longer. But then again, Outsystems may still be optimizing this part. Containerisation also helps to improve the security. It helps to isolate parts of the infrastructure, as apps run in their own sandbox.

### ODC – familiar, but different
The new ODC takes most of the concepts of Outsystems 11. Outsystems showed the new IDE, ODC Portal, which looked very familiar. As they stated, Outsystems wanted to make it easy for developers to make the jump. But there is something to look forward to. Outsystems added functionality from Service Center. For example deployments, monitoring and user access management can now be done from the ODC Portal.

### Improved AI 
Like last year, Outsystems is improving its AI which helps building and validating apps. Formerly known as Architecture dashboard, it will now be called by the [AI Mentor Systems](https://www.outsystems.com/low-code-platform/architecture-dashboard/). As we’ve seen in the last year, Outsystems is including more and more types of validation in this tool. It makes sense to change it’s name since the scope is much larger now. 

### More platform extensibility
Following on the trend of more platform extensibility, Outsystems will now be exposing monitoring and logs through the [OpenTelemetry API](https://opentelemetry.io/). This enables the use of third-party monitoring tools such as [Datadog](https://www.datadoghq.com/), [New Relic](https://newrelic.com/), and {Dynatrace](https://www.dynatrace.com/). Besides logging, Outsystems promises that ODC will be API-first. That will enabling customers and suppliers to build tools that will enhance productivity. I welcome this open approach for tinkering with the platform. It shows that Outsystems is not aiming to be the magic black box, but rather part of a larger infrastructure.
5 Powerful Habits to Master for Success in Strengthen Your PROFESSIONAL PORTFOLIO
Tags: beginners, programming, productivity, career
Published: 2022-11-20 14:07:10

---
title: 5 Powerful Habits to Master for Success in Strengthen Your PROFESSIONAL PORTFOLIO
published: true
tags: beginners,programming,productivity,career
canonical_url: https://makendran.hashnode.dev/5-powerful-habits-to-master-for-success-in-strengthen-your-professional-portfolio
---

![alexander-grey-zi1GRsLym3s-unsplash.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1661202601412/V8m25Ml1t.jpg)

> Analyze the requirements of your dream job and the points you need to reinforce. These are your goals for the year.

![randalyn-hill-Z1HXJQ2aWIA-unsplash.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1661202658001/8RvYNyMhZ.jpg)

> Improve your skills and resume by following the online courses offered by Culture and Creativity

![christina-wocintechchat-com-faEfWCdOKIg-unsplash.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1661202705569/lZhX0zSyO.jpg)

> Schedule five professional events near you to help you connect and get inspired.

![carl-heyerdahl-KE0nC8-58MQ-unsplash.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1661202775457/WqcQ9EAeo.jpg)

> Choose a specialty and build your personal brand by actively using social networks.

![luke-chesser-JKUTrJ4vK00-unsplash.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1661202865828/JY57Y1bl9.jpg)

> Focus on the results or on a specific project (think about your project or a volunteer project you could work on, even if your current job doesn't give you a chance to reach your full potential).

Gratitude for perusing my article till end. I hope you realized something unique today. If you enjoyed this article then please share to your buddies and if you have suggestions or thoughts to share with me then please write in the comment box.

Follow me and share your thoughts,[GitHub](https://github.com/MakendranG)[LinkedIn](https://www.linkedin.com/in/makendran/)[Twitter](https://twitter.com/MakendranG)
I built a instant Blockchain Explorer.
Tags: web3, webdev, ux, css
Published: 2022-11-20 14:01:39



![MuchBalance](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7yyzgitfuw3n1rx1fstl.jpeg)

***View live preview here*** - [MuchBalance](https://muchbalance.github.io)
Try to paste/enter this address to see demo of how it works - "***DDTtqnuZ5kfRT5qh2c7sNtqrJmV3iXYdGG***" without double quotes. 

I made some minor changes in the U.I. of my one of the finest web project Dogecoin & Bitcoin Blockchain Explorer "MuchBalance" website.

It took only 1 and 1/2 day to me to make it work initially, and complete two days from starting to develop and design. It is built using HTML, CSS, JS & a little bit jQuery.

There are too many websites or platforms where you can check your dogecoin/bitcoin address/wallet data or balance, but they redirects you to any other page or take some time to show you your address data.

***Now what is a dogecoin/bitcoin address ?*** - Like we have bank account numbers, by which we can check full details of our bank account in bank.

Same like bank account, cryptocurrency has their unique alpha-numeric addresses, contains crypto balance of different currencies like dogecoin, bitcoin, ethereum etc. etc.

The data of these addresses are public on blockchain, anyone can see the data of any crypto address, we should not reveal our crypto address until or unless we have to receive crypto in that address, no one can access your crypto just by knowing your address, but they can check your balance & transactions that's why it is important to keep it secret; There are too many crypto explorers on the internet for different-different crypto-currencies. 

But I made this project to work instantly, you just have to paste your dogecoin or bitcoin address in input field and it will show you data immediately.

It is live since Apr 5, 2022. You can check recent versions/prototypes of this website on my twitter handle here -[naveen6802](https://www.twitter.com/naveen6802)
Print Particular part of the screen easily when using CMD/CTRL + P in HTML/CSS
Tags: webdev, javascript, beginners, programming
Published: 2022-11-20 13:45:24



Lets say you have some content on your page and whenever user uses `cmd/ctrl + p`  you have to only print the table part.

![Random stuffy using tailwind](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4v3ha50wz32wq7mrh0lu.png)

Now when printing we will get all the stuff fromm our web page. But expected result is the 2nd Image.
![Without](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p5alrh503l3epu8vqpgw.png)
![With](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b59nz27e3hyhx3ud6htg.png)


Here's how you do it. Just add `print-only`  class to whatever stuff you want to print.

The visibility CSS property shows or hides an element without changing the layout of a document.

```css
@media print {
  body {
    visibility: hidden;
  }

  .print-only  {
    visibility: visible;
  }
}
```

_Peace 🕊_

---

If you are here it means you may have enjoyed reading this blog. Just follow me @shrihari which will motivate to write more.

You can make a drink [Buttermilk 🥛](https://www.buymeacoffee.com/shriharimohan). Small support comes a long way!

Subscribe If you want to receive these blogs in your mail from @[Medium](https://medium.com/@shriharimohan) for free!

## Try Our new product for free!
[DocsAI](https://docsai.app/) - Create AI support agents with your documents in the most affordable price, starts at **0$**. Don't need a bot , but need ai help on your docs just upload and start chating !

Using for a company ? [Check out our pricing](https://docsai.app/pricing) Just contact me for personalized pricing !

![docsAi](https://firebasestorage.googleapis.com/v0/b/shrihari-personal-storage.appspot.com/o/banner-docs-jpeg.jpeg?alt=media&token=45c47666-de2a-4e02-8881-beb6e43ce581)
Best Design Trends for 2023
Tags: design, webdev, javascript, react
Published: 2022-11-20 13:33:16

## Long story shorts
I was just wandering in figma and, wondering about life

until,, I though how professional I can get While just making small changes.
so I created very simple design

so we'll gonna start list

## 1. minimalism

so this is just a simple design you can just make it. but this is where new programmers or designer get lost. ok for stater create a minimal file then do anything, like [color theory, glassmorphism, noemorphism , anything].


![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wfeof6q5eambp1e84sx4.png) 

## 2. drop shadowing

Now this design you will use, when your doing backend only, or just programming practice ok :).
this is design is very simple. just as minimal as first one. but it looks good.

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

## 3. color theory

this just basic. I was going for a **RICH** design. so I use golden color. and I also needed smooth colors. so I lower saturation and contrast.

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

## 4. Images
This thing can make design make or brake. I just went to [pexels.com](pexels.com) and downloaded the photo. Its simple

![Image ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5x2vptqt9c176oxowgpq.png)
## 5. Dark mode
Naa, I am Not going talk about it just look at it its too simple just turn background black
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cbckfp1yx9jhq5b7lp5w.png)


## 6. big typography

I read somewhere that big typography looks awesome. so I tested it and its pretty good. 
 
**remember keep position crazy not in center**

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

## 7. glassmorphism
### __this is last one__
this design has been trending for for around a year. to make it better add good image and video.
**_I Just Recommend Video_**

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

## conclusion
### Be Experimental
see, don't use just a single design. try mixing them. just look above and look below.

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

> this is me experimenting dark mode and color theory

**

> Bonus
**

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

> add glow in dark mode


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5yd5ef5gyd4g0irntbyw.png)
> this is me experimenting dark mode, color theory and big typography 



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

> just added Glassmorphism here

## Soo Be experimental
#bye!!