teleren/devto huggingface dataset:
🚀 Top-level await in AWS Lamba with TypeScript
Tags: serverless, aws, typescript, braziliandevs
Published: 2022-08-10 09:39:00

On [version 14.8.0 release](https://github.com/nodejs/node/releases/tag/v14.8.0), almost two years ago, Node.js closed the issue#34558, called [module: unflag Top-Level Await](https://github.com/nodejs/node/pull/34558). From version 14.8 we can use `await` [outside an async function](https://v8.dev/features/top-level-await) inside an ES module. 

After almost two years, we can find Node.js code not taking advantage of it. Furthermore, the complexity of configuring it increases when we consider the usage of bundlers and compilers, like esbuild or TypeScript.

### Execution performance

In ephemeral environments like AWS Lambda, any millisecond we can shave is a flawless victory. [Earlier this year](https://aws.amazon.com/about-aws/whats-new/2022/01/aws-lambda-es-modules-top-level-await-node-js-14/), the AWS Lambda runtime added full support for Node.js 14+ features.

As [Dan Fox](https://twitter.com/danfox) (Principal Specialist Solutions Architect Serverless) explained in [his article](https://aws.amazon.com/blogs/compute/using-node-js-es-modules-and-top-level-await-in-aws-lambda/), we can see around ~45% performance improvements:

![45% performance improvements in scenarios using top-level await in AWS Lambda Node.js runtime](https://github.com/oieduardorabelo/top-level-await-in-aws-lamba-with-typescript/raw/main/docs/await3-1024x400.png)

### Transpiling TypeScript to ES Modules

With a combination of AWS Lambda Serverless development tools, we can easily take advantage of these improvements.

My example uses:

- [Serverless Framework](https://github.com/serverless/serverless)
- esbuild via [serverless-esbuild](https://github.com/floydspace/serverless-esbuild)
- TypeScript for writing AWS Lambda code

The secret sauce is to configure esbuild to output Node.js ES modules files with `.mjs` extension with the following esbuild options:

```yaml
format: "esm"
outputFileExtension: ".mjs"
platform: "node"
target: "esnext"
```

With that in place, you can have a fully typed AWS Lambda code in TypeScript and take advantage of executing `await` outside the handler function, improving the response time for the service consumers.

You can check the entire demo on my GitHub:

{% embed https://github.com/oieduardorabelo/top-level-await-in-aws-lamba-with-typescript %}

- Twitter: [@oieduardorabelo](https://twitter.com/oieduardorabelo)
Convert String to CStr and back in rust
Published: 2022-08-10 09:31:09

---
title: Convert String to CStr and back in rust
published: true
description: Convert String to CStr and back in rust
tags: 
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
---

Just some code snippets to convert rust `String` to `std::ffi::CStr`/`std::ffi::CString` and back.

## String to CString/CStr
```
use std::ffi::CStr;
use std::ffi::CString;

fn main() {
   let s = "Hello World!".to_string();
   let c_string: CString = CString::new(s.as_str()).unwrap();
   let c_str: &CStr = c_string.as_c_str();
   println!("{:?}", c_str);
}
```

## CStr to String
```
use std::ffi::CStr;

fn main() {
   let c_str: &CStr = CStr::from_bytes_with_nul(b"Hello World!\0").unwrap();
   let s: String = c_str.to_string_lossy().into_owned();
   println!("{:?}", s);
}
```
First fortnight of my 100 Days of Code challenge
Tags: 100daysofcode, html, css, javascript
Published: 2022-08-10 09:19:40

I have started the 100 Days of Code challenge to keep myself accountable while I commit to learning React and Node. These two JavaScript frameworks will be used during my [Digital Jobs Program](https://djpr.vic.gov.au/digital-jobs) paid work placement with [Service Victoria](https://service.vic.gov.au/about-us/our-story) as a Software Engineering Intern.

I am also working on launching a blog to chronicle my Educational Design research into digital literacy and digital competence.

You can follow my progress on [GitHub](https://github.com/stweffy88/100-days-of-code/blob/master/log.md) and [Twitter](https://twitter.com/stweffy_88).

So far, I have made/been working on the following projects:

1. [W3schools Space: Digitally Competence Resources](https://digital-competence.w3spaces.com/)

2. [Sololearn: HTML course snippits](https://code.sololearn.com/WnPCf8D4Jyph/?ref=app)

3. [CodePen: React Tutorial fork - Tic Tac Toe](https://codepen.io/stweffy_88/pen/RwMxbRz)

4. [Sololearn CSS course progress](https://www.sololearn.com/Profile/25656677/?ref=app)

5. [Learn the CSS Box Model by Building a Rothko Painting](https://www.freecodecamp.org/stweffy_88)

6. [August 2022 #CodePenChallenge: Looooong Teeeeext](https://codepen.io/stweffy_88/pen/BarxmPz)

7. [JS Fiddle: Social Links: Font Awesome sandbox](https://jsfiddle.net/stweffy_88/yq4vt9L2/52/)

8. [JS Fiddle: Sololearn CSS course properties practise - Narcolepsy symptoms Prezi slides](https://jsfiddle.net/stweffy_88/sxtvn2w8/43/)
Trekking in Nepal 2023/2024
Published: 2022-08-10 09:18:27

NAMASTE AND WARM GREETINGS NEPAL MOUNTAIN GUIDE TEAM
Nepal Planet Treks & Expeditions welcomes you to Nepal the country of the Himalayas, started in 2014 Nepal Planet Treks & Expeditions is one the new and innovated agencies in Nepal. Our Managing Director/Trekking Guide Mr. Sanjib Adhikari has over 18 years of trekking experience and always looks for the newest and unexplored routes to increase your trekking experience. Offering all activities such as; trekking, touring, mountaineering, adventure sports, volunteering, paragliding, jungle safaris, mountain flights and many more Nepal Planet Treks & Expeditions promises you a lifetime of memories on a single trip! Nepal Planet Treks & Expeditions offers the newest way of trekking by letting our guests modify the routes to just explore a bit further in to the beautiful landscape of Nepal. Dealing in sustainable tourism we provide jobs for the local communities by hiring porters directly from the local villages, booking at the local tea houses provides a sustainable income for the rural areas in Nepal. Our Nepal Mountain Guide Team provides you with the best service so that you as our valued guest can enjoy the utmost of your well-deserved holiday/trek. In our team
🔥JSON Web Token (JWT) is quite popular and used for Authentication🔥
Tags: jwt, node, javascript
Published: 2022-08-10 09:04:08

✍🏻 It’s a token-based standard that allows us to securely transfer information between two parties without storing anything in a database.

JWT token consists of three parts:
✔️ Header
✔️ Payload
✔️ Signature
Each one being BaseURL64 encoded to form the token.

𝐉𝐖𝐓 𝐚𝐮𝐭𝐡𝐞𝐧𝐭𝐢𝐜𝐚𝐭𝐢𝐨𝐧 𝐟𝐨𝐥𝐥𝐨𝐰𝐬 𝐚 𝐬𝐢𝐦𝐩𝐥𝐞 4 𝐬𝐭𝐞𝐩 𝐩𝐫𝐨𝐜𝐞𝐬𝐬

1) Client (Browser) 👉 sends post request with credentials to auth server to authenticate themselves

2) Auth Server 👉 authenticates user credential and generates a JWT. Server does not store anything and sends the token to the browser to save. It allows users to authenticate without their credentials in the future. It’s best advised to store the token in an http only cookie.

3) Thereafter 👉 for every request the client sends the JWT in the authorization header. Validation happens using token introspection with the auth server.

4) Once validated, resource server 👉 sends the necessary data to the client.

🚨 This covers a basic understanding of how JWT works. There’s much more to it.

✅ Reading it from jwt[.]io would provide better insights.

Keep growing. Keep learning. 💪
Any suggestion for publushing beta version of the app?
Tags: discuss
Published: 2022-08-10 09:01:14

I have plans to publish my application I'm working on but I'm not sure about the best flow for Beta version. Maybe you have some experience and can suggest something?

I'm thinking about some landing page with described list of features with examples and some form, to subscribe for updates. That way I can find how many people are actually interesting in these features and it can motivate me to make it publically, but if not, then I can keep working on features and improvements.

After that, at some point when the app is ready I send some email, that you can sign in. I guess I will also need some feedback/reporting issue form and I'm pretty sure I forgot something. 

P.S. What is the best way to sign in to the app for you? I was thinking about email + password, but I guess the better solution will be using some secured OAuth. As an example, currently I have Sign In using GitHub only. So, in DataBase I don't store any information like password, or email.
Chat app
Tags: react, javascript, webdev, reactnative
Published: 2022-08-10 08:46:26

𝗜 𝗵𝗮𝘃𝗲 𝗯𝗲𝗲𝗻 𝗱𝗲𝘃𝗲𝗹𝗼𝗽𝗶𝗻𝗴 𝗮 𝗰𝗵𝗮𝘁 𝗮𝗽𝗽, 𝗜 𝘄𝗮𝗻𝘁 𝘁𝗼 𝘀𝗰𝗿𝗼𝗹𝗹 𝘁𝗼 𝘁𝗵𝗲 𝗯𝗼𝘁𝘁𝗼𝗺 𝘄𝗵𝗲𝗻 𝗮 𝗻𝗲𝘄 𝗺𝗲𝘀𝘀𝗮𝗴𝗲 𝗶𝘀 𝗿𝗲𝗰𝗲𝗶𝘃𝗲𝗱,

𝘐 𝘧𝘰𝘶𝘯𝘥 𝘶𝘴𝘦𝘙𝘦𝘧 𝘪𝘴 𝘣𝘦𝘴𝘵 𝘵𝘰 𝘪𝘮𝘱𝘭𝘦𝘮𝘦𝘯𝘵 𝘢 𝘴𝘤𝘳𝘰𝘭𝘭 𝘦𝘧𝘧𝘦𝘤𝘵 𝘪𝘯 𝘙𝘦𝘢𝘤𝘵 

```
𝘤𝘰𝘯𝘴𝘵 𝘮𝘦𝘴𝘴𝘢𝘨𝘦𝘴𝘌𝘯𝘥𝘙𝘦𝘧 = 𝘶𝘴𝘦𝘙𝘦𝘧(𝘯𝘶𝘭𝘭)

𝘤𝘰𝘯𝘴𝘵 𝘴𝘤𝘳𝘰𝘭𝘭𝘛𝘰𝘉𝘰𝘵𝘵𝘰𝘮 = () => {

    𝘮𝘦𝘴𝘴𝘢𝘨𝘦𝘴𝘌𝘯𝘥𝘙𝘦𝘧.𝘤𝘶𝘳𝘳𝘦𝘯𝘵.𝘴𝘤𝘳𝘰𝘭𝘭𝘐𝘯𝘵𝘰𝘝𝘪𝘦𝘸({ 𝘣𝘦𝘩𝘢𝘷𝘪𝘰𝘳: "𝘴𝘮𝘰𝘰𝘵𝘩" })

 }
```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jl6euspitvlp14kx79ve.png)
#TestCulture 🦅 Episode 16 - Manage legacy testing application
Tags: testing, agile, devops, beginners
Published: 2022-08-10 08:43:00

𝐖𝐡𝐚𝐭 𝐢𝐬 𝐥𝐞𝐠𝐚𝐜𝐲 𝐭𝐞𝐬𝐭𝐢𝐧𝐠? A legacy software is a software that has been in production for some time. It may have had several successive versions or code refactorings that correctly met the customer's needs.

The 𝚖𝚊𝚒𝚗𝚝𝚎𝚗𝚊𝚗𝚌𝚎 of this kind of solution can be reduced to a minimum: few evolutions and limited bug fixes. The 𝚖𝚊𝚒𝚗𝚝𝚎𝚗𝚊𝚗𝚌𝚎 can be ensured by a team composed of a part-time single person.

This kind of software is ‘𝑎𝑠 𝑖𝑠’ as far as the testing and validation aspects are concerned, and 𝗲𝘃𝗲𝗿𝘆𝘁𝗵𝗶𝗻𝗴 𝗶𝘀 𝗽𝗼𝘀𝘀𝗶𝗯𝗹𝗲: manual tests galore or redundant tests, automated tests on several automation solutions, no data tests, no unit tests…

𝐖𝐡𝐲 𝐢𝐬 𝐥𝐞𝐠𝐚𝐜𝐲 𝐭𝐞𝐬𝐭𝐢𝐧𝐠 𝐚𝐩𝐩𝐥𝐢𝐜𝐚𝐭𝐢𝐨𝐧 𝐜𝐡𝐚𝐥𝐥𝐞𝐧𝐠𝐢𝐧𝐠?
👉 𝗠𝗮𝗻𝘂𝗮𝗹 𝘃𝗮𝗹𝗶𝗱𝗮𝘁𝗶𝗼𝗻. It is time-consuming, and it generates roadblocks for development activities.

👉 𝗛𝗶𝗴𝗵 𝗺𝗮𝗶𝗻𝘁𝗲𝗻𝗮𝗻𝗰𝗲. Manual testing becomes impossible to maintain without consuming a lot of time and resources.

👉 𝗣𝗼𝗼𝗿 𝗾𝘂𝗮𝗹𝗶𝘁𝘆. Legacy testing applications generate too much back and forth with clients, resulting in low quality problems.

👉 𝗖𝗼𝘀𝘁 𝗺𝗮𝗻𝗮𝗴𝗲𝗺𝗲𝗻𝘁. Legacy testing applications make it hard to maintain or increase the quality at the lowest cost or in check with QA budget.

Thread [on Twitter](https://twitter.com/agilitest/status/1545060489696186370?s=20&t=kF9ifxoFCx5WkaBOVAbx4w).

-------
📚 𝕊𝕠𝕦𝕣𝕔𝕖𝕤:
🦅 https://agilitest.com/challenges/legacy-testing-application#
📰 https://agilitest.com/blog/reasons-for-test-automation-failure-lack-of-analysis
📰 https://agilitest.com/blog/when-should-you-automate-software-tests
Decision to Vim - #3. Advice from JohnGrib
Tags: vim
Published: 2022-08-10 08:06:00

어제 내 Vim 관련 트윗에 [종립님](twitter.com/John_Grib)의 답변 트윗을 받았다. 어제 Decision to Vim #2를 트위터에 공유했는데, 역시 블로그를 쓰고 공유하게 되면 내가 공부하고 있는 방식에 대한 리뷰와 피드백을 받을 수 있고, 나중에 나와 비슷한 길을 걷게 되는 사람들도 도움을 받을 수 있다는 점이 참 좋은 것 같다.


## 답변 트윗들

### 1. 

제가 추천하는 가장 좋은 방법은 자기 블로그 같은 걸 Vim으로 "매일" 쓰면서 Practical Vim 책을 끝까지 다 읽는 겁니다. 그러면 어지간한 진입장벽은 다 넘어가고, 그 다음부터는 많이들 쓰는 플러그인 사용 방법만 익히면 돼요. 그 이후로는 직접 플러그인을 만들어보면 됩니다.

### 2. 

이렇게 하는 이유가 있습니다. 보통 Vim에 도전했다가 그만두는 케이스의 상당수가 Vim을 써서 일을 해보려 하다가 평소 사용하던 IDE만큼 생산성이 안나와서 답답함을 느끼기 때문이거든요. 그런데 코딩을 제대로 하려면 생각보다 훨씬 많은 플러그인의 조합이 필요합니다.

### 3. 

그래서 플러그인이 별로 필요하지 않은 그냥 블로깅이나 일기 쓰기 같은 걸 Vim으로 매일 하면서 익숙해지는 걸 노리는 거죠. 코딩할 때에는 평소 쓰던 IDE를 그대로 써도 되고, IDE의 vim 에뮬레이션 플러그인을 껐다 켰다 하면서 쓰면 됩니다.

### 4. 

IDE의 vim 플러그인을 쓰면 다른 것들은 신경쓰지 않고 vim의 '텍스트 처리 언어' 학습에 몰두할 수 있어요. 이게 꽤 재밌게 느껴진다면 절반은 성공한 겁니다. 그대로 IDE + vim 플러그인으로 평생 살아도 좋고요. 뭔가 더 욕심이 난다면 그때가서 vim만으로 뭔가 하는 쪽으로 기웃거려도 됩니다.

### 5. 

IDE에서 처음부터 한 줄 한 줄 코딩할 때에는 vim의 매력이 좀 덜 느껴질 거에요. IDE + vim 플러그인을 쓸 때 강력함을 맛보기 좋은 사례는 이미 많이 있는 코드를 수정할 때입니다. (노말 모드에서 vip 같은 걸 입력해 보세요. 그리고 그 상태에서 o 를 입력해 보세요.)

## 수정된 Vim 공부법

사실 최근엔 Vim 공부를 하겠다고 했지만, 더 우선순위가 높은 작업들을 하나도 하지 못했다. 목록을 만들면 다음과 같다.

* 이력서의 자기소개서 수정 이후 제출
* 포트폴리오 프로젝트 [pride-profile](https://github.com/koremp/pride-profile)
  * supabase 쪽 연동하기
  * 컴포넌트 만들고 페이지 만들기
  * 테스트 구현(tdd)
  * cypress, codeceptjs 등의 e2e test 구현
* [FE Roadmap by euncho](https://euncho.medium.com/%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%ED%95%99%EC%8A%B5-%EB%A1%9C%EB%93%9C%EB%A7%B5-91c3bc11dec0) - html, css, js 기초 공부
* 면접 공부
  * CS 기초 공부
  * 알고리즘 공부
  * 코딩테스트 공부
  * 과제 전형들 복습

아무튼 이거 다 못해서 [우울함의 하강나선](https://brunch.co.kr/@lifedesigneer/86)을 돌고 있었다.

일단 하나씩이라도 처리하면서 뭐라도 하는게 좋을 것 같다. 나에겐 GTD도 투두리스트도 아사나도, 혼자서 하는데 많이 버겁다. 그냥 지원하면서 배우자.

## Vim 학습 계획

그래서 나는 종립님이 알려주신 방법으로, 매일 Vim 을 사용하여 간단한 텍스트 편집을 해볼 생각이다. 그리고 [Practical Vim](http://www.yes24.com/Product/Goods/36686205)을 보면서 공부하려고 한다. 

그리고 뭐 하나씩 해결해가야지 뭐. 하강나선을 깨는 방법은 그냥 뭐라도 하는 것이니까. 이력서의 자기소개부터 가봅시다.
How to Use Strike Tag (cut text) in Tailwind CSS
Tags: tailwindcss, css, webdev, tutorial
Published: 2022-08-10 07:56:29

In this short tutorial we will see how to use strike tag (cut text) in tailwind css.
[view](https://larainfo.com/blogs/how-to-use-strike-tag-cut-text-in-tailwind-css)

### Example 1 
You can use "line-through" class to create strike tag in tailwind css.
```html
<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Tailwind CSS Strike Example</title>
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body>
    <div class="flex items-center justify-center h-screen">
      <p class="line-through">strike tag (cut text) in tailwind css </p>
    </div>
  </body>

</html>
```

![tailwind strike tag](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gehlpdf9tny68ojsf83s.png)

### Example 2
tailwind strike tag with color and size.
```html
<p class="text-xl text-red-600 line-through">strike tag (cut text) red color in tailwind css </p>
<p class="text-xl text-green-600 line-through">strike tag (cut text) green color in tailwind css </p>
<p class="text-xl text-blue-600 line-through">strike tag (cut text) blue color in tailwind css </p>
```

![tailwind css strike tag color](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7rjeyfl3dpt07hvczygl.png)

### Example 3
tailwind hover strike tag.
```html
<p class="hover:line-through">Hover strike tag (cut text) in tailwind css </p>
```
MySQL 1062 - Duplicate entry 'xxx' for key 'PRIMARY' Cannot Create New Post in Wordpress
Tags: wordpress
Published: 2022-08-10 07:32:00

What happened was that the admin could not create the new posts. It show the white page with warnings. At first I was searching through internet relating to that warning, then I came to realize that they are just the warning and not the actual error. The thing was the site I was handling doesn't allow to use FTP. So literally I could not change the wp-config.php to enable debug mode. So I installed the plugin called "Debug" and set the debug mode then viola! the actuall error came out with text in black.

```sql
MySQL 1062 - Duplicate entry '400' for key 'PRIMARY'`
```

So I installed plugin called "SQL Executioner"
and execute the command

```sql
describe wp_posts;
```

Then I got the schema of the wp_posts table. It's ID already set to autoincrement. But how did that ID=400 was inserted,I did'nt know. So I backup the database with "Updraft Plus" plugin and executed the following command to remove that ID = 400 post from wp_posts table

```sql
delete from wp_post where ID = 400;
```

Banzai!
The site was back to normal, no more error when creating new posts. So as a house cleaning I deleted back all the plugins I used for debugging and troubleshooting. Of course I don't want someone to type gibberish in "SQL Executioner" and corrupt the database. So housekeeping was necessary.

Fin
How to create an interactive donut chart using SVG and CSS.
Published: 2022-08-10 07:24:30

Today we are going to discuss about how to make a custom donut chart. I  got a task for build a donut chart for my project and as part of that i want to create an angular component which can be reused everywhere inside the project .
At first i thought of building the donut chart with the help of some libraries or plugins so that it can save me some time. But eventually i find it better to do with a svg donut chart.
So in search of that i found a blog and that was quite easy to understand. I used the same steps that were discussed in the blog. So i think this might also help you a lot. That's why am also sharing the link here .

link : https://heyoka.medium.com/scratch-made-svg-donut-pie-charts-in-html5-2c587e935d72

Cheers!
How to Get Testnet ETH and MATIC
Tags: blockchain, testing, polygon, ethereum
Published: 2022-08-10 07:23:00

## ETH
**Goerli Testnet**

A proof-of-authority testnet that works across clients; an ideal testnet for application developers. Goerli will be the final testnet merged to proof-of-stake before Ethereum Mainnet is merged. This is expected to happen in summer 2022. Goerli is expected to be maintained long term as a proof-of-stake testnet.

- [Etherscan ](https://goerli.etherscan.io/)

**Goerli Faucets**
- [Alchemy faucet](https://goerlifaucet.com/)
- [Chainlink faucet](https://faucets.chain.link/goerli)

## MATIC
**Mumbai Testnet**

The Mumbai testnet is the testnet of the Polygon network, which replicates the Polygon mainnet. It enables developers to deploy, test, and execute their dApps in the blockchain environment risk-free and at no cost. 

- [Polygonscan](https://mumbai.polygonscan.com/)

**Mumbai Faucets**
- [Polygon faucet](https://faucet.polygon.technology/)
- [Alchemy faucet](https://mumbaifaucet.com/)
- [Chainlink faucet](https://faucets.chain.link/mumbai)

Follow me on [twitter](https://twitter.com/theekrystallee).
EmailIt First Release!
Tags: svelte, wails, email, scripts
Published: 2022-08-10 07:02:31

---
title: EmailIt First Release!
published: true
description: Announcing the first release of the EmailIt program.
tags: Svelte, Wails, email, scripts
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rpadp9t3n1y1ar3uus2g.png
---

This is just to let everyone know that I just released the first version of the [EmailIt](https://github.com/raguay/EmailIt) program. The documentation isn't all there, but the program works. I use it everyday on my computer. It is built as a macOS universal build. It is built using Wails, and Svelte.

It’s a handy little markdown based email sending only program with nine notepads, scripts to manipulate the text, and templates. It also has a script terminal with minimal commands, a bundled Node-Red server, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program.

Give it a try and let me know how you like it in the [discussions](https://github.com/raguay/EmailIt/discussions).
Screenshot of my qtile setup i've been working on for the last few days...
Published: 2022-08-10 06:58:30


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


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


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ors7zxo28w28rvh2i82w.png)
Vue JS
Tags: javascript, vue, beginners
Published: 2022-08-10 06:44:06

Hi everyone,

I am learning Vue JS as my frontend technology and so far so good. I however have questions so far.

Having converted an HTML template to Vue App, my Javascript is not working with the single page app approach and so I am reloading on redirection. Would this approach be accepted as an industry standard?

If anyone has done this before, how do I make my JS work without reloading?

Any recommendations or guidance will be appreciated.
Decorators part II
Tags: python, tutorial
Published: 2022-08-10 06:22:42

This is a continuation to the previous post [decorators in python](https://dev.to/xzm27/decorators-in-python-4cmd).
Previously we passed the function `display` into the decorator function. But what if the `display` function has some arguments that it takes?

```
def decorator_function(original_function):
    def wrapper_function():
        #do something before the function
        print("hello from wrapper")
        return original_function()
    return wrapper_function


#this works same as decorator_function(display)
@decorator_function
def display():
    print("hello from display")

display()
```

**Passing arguments into decorators**
lets pass down some arguments in `display` and see what happens.

```
@decorator_function
def display(name, age):
    print(f"hello from {name}. I am {age} years old.")

display("Dev", 15)
```
**Output**

```
TypeError: wrapper_function() takes 0 positional arguments but 2 were given
```
It throws an error because right now the wrapper function cannot take any arguments. This can be fixed by using `*args` and `**kwargs`.

```
def decorator_function(original_function):
    def wrapper_function(*args, **kwargs):
        #do something before the function
        print("hello from wrapper")
        return original_function(*args, **kwargs)
    return wrapper_function


#this works same as decorator_function(display)
@decorator_function
def display():
    print(f"hello from {name}. I am {age} years old.")

display("Dev", 15)
```
`*args` allows us to pass any number of positional arguments and `**kwargs` allows us to pass any number of keyword arguments into the `wrapper_function`. Now we can pass any number of arguments into our decorated function.
**Output**

```
hello from wrapper
hello from dev. I am 15 years old
```
Thank you for reading and learning.