teleren/devto huggingface dataset:
Notes - The Coding Career Handbook
Published: 2021-04-28 16:14:11

---
title: Notes - The Coding Career Handbook
published: true
date: 2021-02-19 00:00:00 UTC
tags: 
canonical_url: https://petermekhaeil.com/notes-the-coding-career-handbook/
---

These are my learnings from reading [The Coding Career Handbook](https://www.learninpublic.org/) by [Shawn Wang](https://www.swyx.io/). Notes for my future-self. I highly recommend this book for everyone of all levels in their career.

Notes from Part I - Your Coding Career:

### Chapter 4: Junior Developer

- "It is quite often that doing the things nobody else wants to do often ends up making you indispensable, because A) it has to be done and B) nobody else wants to do them. If you figure out a clever way of doing it, you could even make a career (or startup) out of it!"

Tests are the most common example of this. In fact, a really great way to start a new job is to volunteer to write tests.

> “When one teaches, two learn.” - Robert Heinlein

### Chapter 5: From Junior to Senior

- 

Much of your learning from Junior to Senior involves gaining **tacit knowledge**. You can read all the programming books in the world, but, by definition, you are still limited to things that people can write down. Tacit knowledge in engineering is a real thing. Keep a look out for all the lessons you don’t learn in classes or from books. To really make your career explode, make a habit of writing them down for everyone else (Chapter 18 - Write, A Lot!).

- 

In particular, anything you do in public - blogging, speaking, podcasting, making video tutorials, open source work - can help you grow your knowledge and your network at the same time, opening up the possibility for inbound opportunities to come to you. Remember to fight Impostor Syndrome every step of the way!

### Chapter 6: Senior Developer

- "The best way to be a 10x developer is to teach 10 people what you know."

> "The most valuable engineers are the ones who habitually view their work through the lens of what the business needs to succeed. Which is a skill you have to practice and foster and cultivate, just like any other." - Charity Majors

### Chapter 7: Beyond your Coding Career

> "Becoming a manager is not a promotion - it’s a lateral move onto a parallel track. You’re back at junior level in many key skills." - Sarah Mei

- "The best individual contributors are the ones who have done time in management. And the best technical leaders in the world are often the ones who do both. Back and forth. Like a pendulum."
ceme online
Published: 2021-02-19 04:16:57

Selamat datang di Poker383 ceme online, sebagai situs agen game <a href="https://goexback.com/">ceme online</a> yang andal dan terbaik di Indonesia pada tahun 2021. Poker383 adalah situs game online IDN Poker dan Bandar Ceme Online menggunakan uang sungguhan tepercaya. Apa yang menyediakan berbagai jenis permainan, seperti: Poker Online, ceme online, Dominoqq / Qiu Qiu, Capsa Organice, CEME, CEME Mobile, Omaha, Super10 dan <a href="https://goexback.com/">idn poker</a> Blackjack. Dengan semua jenis permainan, pemain dapat mendaftar 1 akun hanya untuk dapat memutar semua game yang ada.
Advice for a fresh starter
Published: 2021-02-19 04:13:20

With almighty God's blessing, I recently got an offer as junior programmer, so I asked my mentor for advice on how to better mentally prepared in a workplace.

From my mentor:

**Right Mindset**
Realizing you're going to mess up in the beginning, you're going to be terrible, you're going to do a lot of stupid stuff and that's OK, you're there to learn, so learn. don't stop learning. don't stop learning once you get the answer, learn more.

You'll need to figure out what works for you. Sometimes it's more efficient when you have a concrete goal.

**Ask**
Nobody expects you to know everything or anything really.. but they need you to tell them when you're stuck.
So if you work on a task, try to figure it out on your own. If you can't make progress for a day, go ask for help.

Never end up in a situation where you wasted 3 days trying to do someting without asking for help or telling someone you're stuck.

The best format is "I'm trying to do X because I need to do Y. I tried to do Z and T but it didn't work. I looked on the web and read through the documentation but I don't know where to go from here".

Tell them what you want, tell them why you want it, tell them what you tried and show them that you did some work to figure it out already.

I'd add one: **confront the dragon**,slay it!ʕ•́ᴥ•̀ʔっ
Useful Django 3rd party packages part 1
Tags: django, python, webdev, codenewbie
Published: 2021-02-19 03:56:10

#### as you already know that using 3rd party packages or libraries saves you a lot of time to make your work done.
#### here is a list of Django 3rd which could help you to boost your project development.


##1. django-extension
it is one of the best and popular django packages, it has a lot of features including custom commands (`shell_plus` `admin_generator`, ...), custom fields, and more.

Doc: https://django-extensions.readthedocs.io/en/latest/index.html
Source: https://github.com/django-extensions/django-extensions

##2. django-crispy-forms
if you are you using forms a lot and your skill on the front-end is so bad as mine, I better recommend you to use it, it controls the rendering of you form and make it nice looking.

Doc: https://django-crispy-forms.readthedocs.io/en/latest/
Source: https://github.com/django-crispy-forms/django-crispy-forms

##3. django-seed
yeah, I know that you're probably sick up of visiting the admin page every time you've made changes to your models, me too and that is why you should use this package, it fills your DB with fake data which you can use for testing.

Doc: not available (read their README.md on the link below)
Source: https://github.com/Brobin/django-seed

##4. django-autoslug
this package provides `AutoSlugField` which is exactly the same as Django `SlugField` but it is an auto-filled field, it is so helpful when you don't want to use signals or use `slugify` function on your view or form.

Doc: https://django-autoslug.readthedocs.io/en/latest/index.html
Source: https://github.com/justinmayer/django-autoslug

##5. django-b2
this package provides a Django storage backend for [BackBlaze](https://www.backblaze.com/) I'm using it as an alternative to AWS.

Doc: not available (read their README.md on the link below)
Source: https://github.com/pyutil/django-b2
How to use all TailwindCSS colors in your project
Tags: tailwindcss, javascript, tutorial, styling
Published: 2021-02-19 02:39:11

Hey if you wanted to use the brand new TailwindCSS color palette :
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mqmv3bl5akdj6olp4b4w.png)

## How to add the brand new palettes

### Step 1/2

Add the `full-palette` dependencies
```
yarn add full-palette --dev
```

## Step 2/2

Open the tailwind.config.js
```js
module.exports = {
  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
  darkMode: false,
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  presets: [require('full-palette')], // The line to add :D
  plugins: [],
}
```
And add the `require('full-palette')` to the `presets` properties in the tailwind config.

And that's it, thanks for reading this post :D
A kanji dictionary made with Flutter
Tags: flutter, mobile, dart, firebase
Published: 2021-02-19 02:30:00

<p align="center">
  <img width="280" alt="Screen Shot 2020-03-03 at 1 22 57 PM" src="https://user-images.githubusercontent.com/7277662/90493962-d5660b80-e0f7-11ea-9971-dba0951fd60e.png"> 
  <img width="280" alt="Screen Shot 2020-08-20 at 6 16 26 PM" src="https://user-images.githubusercontent.com/7277662/90866236-75b26f00-e348-11ea-82e9-b8af9fd98b3d.png">
<img width="280" alt="Screen Shot 2020-08-20 at 6 16 43 PM" src="https://user-images.githubusercontent.com/7277662/90866275-81059a80-e348-11ea-909d-f2fd1141959c.png">
  <img width="280" alt="Screen Shot 2020-03-03 at 1 25 18 PM" src="https://user-images.githubusercontent.com/7277662/90494379-4d343600-e0f8-11ea-82c2-f462beb91396.png">
<img width="280" alt="Screen Shot 2020-08-20 at 6 21 33 PM" src="https://user-images.githubusercontent.com/7277662/90866315-8e228980-e348-11ea-9df3-35cbcdc71e26.png">
<img width="280" alt="Screen Shot 2020-08-20 at 6 21 48 PM" src="https://user-images.githubusercontent.com/7277662/90866324-8fec4d00-e348-11ea-8d88-e55d66173563.png">
<img width="280" alt="Screen Shot 2020-08-20 at 6 16 50 PM" src="https://user-images.githubusercontent.com/7277662/90866266-7f3bd700-e348-11ea-9bf6-d5a2434f205a.png">
<img width="280" alt="Screen Shot 2020-04-19 at 5 59 00 PM" src="https://user-images.githubusercontent.com/7277662/90494393-51f8ea00-e0f8-11ea-8645-97dd3136844f.png">
<img width="280" alt="Screen Shot 2020-04-20 at 8 01 24 PM" src="https://user-images.githubusercontent.com/7277662/90494401-53c2ad80-e0f8-11ea-8aec-70ebe5e3cb61.png">
</p>

https://github.com/Livinglist/Manji

Hope you guys like it!
how to add this to my website?
Published: 2021-02-19 02:11:18

Hello, I am new to react. I found this link below and followed the instructions and added it to my website (https://mybibletopics.com)

https://reactjs.org/docs/add-react-to-a-website.html#optional-try-react-with-jsx

However, what I would like to do is figure out how to implement this link below on my website to I can utilize it to create my own mind maps for my bible topics.

http://projectstorm.cloud/react-diagrams/?path=/story/simple-usage--simple-example

Any help would be greatly appreciated, thanks,
A chrome extension to mute words on facebook newsfeed!
Tags: react, github, sideprojects, javascript
Published: 2021-02-19 01:01:08

Hey all, I developed a chrome extension to mute words on facebook newsfeed. But I didn't test it on a variety of facebook languages so if you're using facebook from chrome, So it's nice to give the extension a try from here 
https://chrome.google.com/webstore/detail/mute-words-on-facebook/fhcioeahbcdffnkfgkbgghgdchbokohh

Source Code: https://github.com/zeyadetman/mutewords
I'm waiting your feedback.
100 Bytes Of Wisdom: Day 5
Tags: career, journey, advice
Published: 2021-02-19 00:46:56

---
title: 100 Bytes Of Wisdom: Day 5
published: true
description: Bytes of Wisdom is a new project by Sam Jarman that brings together snippets of advice for software engineers
tags: career, journey, advice
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7a7f0b9jh4qjwo8z8ilh.png
---

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7a7f0b9jh4qjwo8z8ilh.png)

There will always be bugs in code. Always. There will also be code that needs to be changed, added to, or removed from. Code can never really be perfect. But to the next developer, you should aim to be perfectly understandable. 

Heads up: As with any terse bit of advice, there will be exceptions of course, and subtleties and nuance that can't possibly be captured in a Byte of Wisdom. This has been what I've experienced, I'd love to hear yours in the comments too!

You can catch up with all the other bytes at http://bytesofwisdom.com/
What can we learn from Citi's $900 million mistake?
Published: 2021-02-19 00:17:03

Back in 2020 Citigroup accidentally sent almost USD$900 million to Revlon's creditors. About half the money was returned, but 10 creditors held on to the money and a judge has just ruled that [they can keep the money](https://www.nytimes.com/2021/02/17/business/dealbook/citigroup-900-million.html).

In short, Revlon sent Citi a few million for them to transfer to creditors as an interest payment. A Citigroup employee didn't fill out a form in a program correctly, so Citi paid off Revlon's loan in full using their own money. Oops.

Here's the form, can you see the problem?
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7w0bzzvxt80suf5afut2.png) (sourced from the [court record](https://www.courtlistener.com/recap/gov.uscourts.nysd.542310/gov.uscourts.nysd.542310.243.0_2.pdf))
 
Thought not. In order to **not** send lots of money you need to check all of the PRINCIPAL, FUND and FRONT boxes.

## What can we learn from this?

The real question is what can the rest of us learn from this mistake? Not that people make mistakes or should be fired (three different people looked at and approved the transfer), but the importance of good UI. To me, there are three main takeaways.

### Safe defaults
Usually we should make the common case the default, that's just good UX. But when one of the options is dangerous and the other safe, make the default the safe one.

Think about your ops tools, how many have `--dry-run` flags instead of `--for-realsies`? A repeated trend I've seen in outages is someone ran a command, didn't realise they were targeting production and oops.

### UI states should match business logic states
Is every combination of checkboxes actually valid? If you have redundant information in the UI you should either consolidate it, or error on mismatch. Either you know what the user wants, in which case you didn't need to ask for it in the first place, or you don't, in which case don't guess. As with all rules you may want to bend this one for convenience but the dangerous an operation the more pedantic you should be.

### Adding more reviewers only goes so far.

A common pattern after outages is to add more reviewers for changes: "someone ran the foobar tool and took out a datacentre, now all users of the foobar tool need a second person to check the command and approve before running it". In a pinch it can help, but it's a short-term mitigation. It slows you down, takes more person-time, randomises people, and still doesn't give you as much safety as improving the tool itself.

## Obligatory Disclaimers

* The above is a very brief summary of what happened, it's more complicated than I made it out to be. Please read the linked article and court record for more details
* All opinions are my own and do not represent my employer
Solve SECURITY Issues - a DevOps Perspective
Tags: devops, security, devsecops, codenewbie
Published: 2021-02-19 00:10:25

Today we talk about __security and vulnerabilities__, and how to approach and manage them in a __DevOps__ context.

### Intro

Let's say your team or some other team has __identified a security issue or vulnerability__ in your application, system, or anything else.

How to approach the __remediation__? How and when to work on it?

### Video

As usual, if you are a __visual learner__, or simply prefer to watch and listen instead of reading, here you have __the video with the whole explanation and demo__, which to be fair is much ___more complete___ than this post.

{% youtube _COrbeZMF1k %}

([Link to the video: https://youtu.be/_COrbeZMF1k](https://youtu.be/_COrbeZMF1k))

If you rather prefer reading, well... let's just continue :)

### About Critical Issues

First of all, needless to say, if that issue is __critical__, like for example it could lead to information theft or to compromise sensitive data, you should __fix it right away__ and deploy it as soon and as quick as possible. I think we can all agree on this.

This is a scenario, however, which __should rarely happen__ if you do security in the right way. I will soon have a whole article and video about "_doing security right_" so stick around if you don't want to miss it :).

Let's focus instead on issues that are not critical, of course we still need to work on them. What is the best way to approach this "additional work", if you will?

### How to Handle Issues and Vulnerabilities

Well, I hope this is not a surprise to you but... the best thing you can do is __make it part of your normal work__.

What does this mean? Well, simply put it means you should plan for it in your sprints or iterations, and ___have your team work on them as you do on all the other features___, tasks and stories.

![Normal Work](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1p47m5il29nfi9ax2q3k.png)

This is the key: __plan for it__. Make it part of your daily work, have everyone in your team take up some of that work.

If you leave the security work like a sort of __extemporary work__, what will inevitably happen is that you will __increase your technical debt__.

If you instead make it part of the __normal work__, everyone will get __used to work on that__ if needed and so the issues will be solved in a timely manner.

___Final pro tip___: don't do this only for security issues and vulnerabilities, but treat security improvements the same way and you'll see your software getting better and more secure in a really short time.

### Conclusions

So, what do you think of this approach? How do you manage and resolve your security issues and vulnerabilities?
Let me know in the comment section below.

{% youtube _COrbeZMF1k %}
How to get user input value from an input tag in Reactjs?
Tags: react
Published: 2021-02-19 00:00:00

---
  title: How to get user input value from an input tag in Reactjs?
  published: true
  tags: Reactjs
  date: Fri Feb 19 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/get-user-input-value-from-input-tag-reactjs
  cover_image: https://melvingeorge.me/_next/static/images/main-219329fceff33e519f62c39910210a7e.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/get-user-input-value-from-input-tag-reactjs)
  
To get input value from an input tag in Reactjs, you can use the `target.value` property of the [Event](https://reactjs.org/docs/events.html) which is passed by the `onChange` handler whenever the user types on the input tag.

For example first let's make an input tag,

```jsx
export default InputTag(){
    return (
        <input type="text" />
    );
}
```

After that, we can attach an `onChange` handler to it so that whenever the user types on the input field it should invoke the function provided in the `onChange` handler.

### NOTE: `onChange` attribute - The handler function attached to this attribute will be invoked every time whenever the user types something into the input field.

it can be done like this,

```jsx
export default InputTag(){
    // onChange Handler function
    const getInputValue = ()=>{
        // do cool stuff here!
    };

    return (
        // Add onChange handler with function to execute
        <input type="text" onChange={getInputValue} />
    );
}
```

Now we have a working handler that will be invoked whenever when the user enters something into the input field.

Still, we haven't added the logic to get the user input value. Let's add that now!

Every time the user enters something into the input field a [Synthetic Event](https://reactjs.org/docs/events.html) is passed as a parameter to the `onChange` handler function. Thus the user input value is present in the `event.target.value` property.

So in the `onChange` handler function let's write a parameter called `event` like this,

```jsx
export default InputTag(){
    // onChange Handler function
    // with event parameter
    const getInputValue = (event)=>{
        // show the user input value to console
        const userValue = event.target.value;

        console.log(userValue);
    };

    return (
        // Add onChnage handler with function to execute
        <input type="text" onChange={getInputValue} />
    );
}
```

Now type something into the input field and you can see that value by opening the console.

Yay! That's it! 🔥😃. We have successfully retrieved the user input value in Reactjs.

You can also store the `userValue` into a react state to use it to process information or for sending the value to a server etc.

See the above code in action in [Codesandbox](https://codesandbox.io/s/get-user-input-value-from-input-tag-in-reactjs-k7p6r?file=/src/App.js).

### Feel free to share if you found this useful 😃.

---
Let's write a tiny JSON parser in Kotlin! Part 1: Characters
Tags: kotlin, json, tutorial
Published: 2021-02-18 23:45:45

In [the previous post](https://dev.to/williambl/let-s-write-a-tiny-json-parser-in-kotlin-part-0-understanding-json-477h), we looked at the elements that make up JSON. Now, lets start building something that can recognise them!

To start off with, we'll need to define three important building blocks of JSON: **whitespace**, **digits**, and **hex digits**.

### Whitespace

![A diagram showing the grammar for whitespace](https://willbl.dev/img/json/whitespace.png)

You'll remember that **whitespace** is a string of zero or more spaces, line feeds (`\n`), carriage returns (`\r`), and horizontal tabs (`\t`).

To check if a character is a valid part of whitespace, we can define the following [extension function](https://kotlinlang.org/docs/reference/extensions.html):

```kotlin
fun Char.isWhitespace(): Boolean {
    return this == ' ' || this == '\r' || this == '\n' || this == '\t'
}
```

which checks if the character is one of the characters allowed in whitespace. Simple!

### Digits

Digits are even simpler: the Arabic numerals 0..9. We can check if a character is a valid digit with this:

```kotlin
fun Char.isDigit(): Boolean {
    return this in '0'..'9'
}
```

This works because in [ASCII](https://en.wikipedia.org/wiki/ASCII) (and therefore also in Unicode) the characters for the ten digits are all assigned consecutive numbers - so
`this in '0'..'9'` becomes `'0' <= this && this <= '9'`, and `'0'` and `'9'` become their respective ASCII codepoints.

### Hex Digits

```kotlin
fun Char.isHexDigit(): Boolean {
    return this in '0'..'9' || this in 'a'..'f' || this in 'A'..'F'
}
```

This is pretty much the same as `isDigit`, but with extra checking for digits A through F. Remember to check for both upper and lower case!

### Conclusion

All of these functions could also be written as [expression functions](https://kotlinlang.org/docs/functions.html#single-expression-functions) - give that a go!

In the next post, we'll start work on our parser.
Start Building With 40 Free Cloud Services
Tags: ibmcloud
Published: 2021-02-22 19:55:07

---
title: Start Building With 40 Free Cloud Services
published: true
date: 2021-02-18 23:35:46 UTC
tags: IBMCloud
canonical_url: https://maxkatz.org/2021/02/18/start-building-with-40-free-cloud-services/
---

Most people perhaps are not aware of this: IBM Cloud offers 40 free cloud services. You can register for a completely free plan called Lite (no credit card needed) that will never expire and start building with any of the 40 free services. I think it’s pretty awesome and you get a lot of value (more [info](https://cloud.ibm.com/docs/account?topic=account-accounts#lite-account-features) on what you get).

Every service offers a free generous tier. For example, the [Cloudant](https://cloud.ibm.com/catalog/services/cloudant) service includes the following:

- 20 Reads per second
- 10 Writes per second
- 5 Queries per second
- 1 GB Storage

How can you see all the free cloud services? Go to this [page](https://cloud.ibm.com/catalog?search=label%3Alite#services) (it has the Lite services filter on) to see all services included in the Lite plan.

If you want to see all the services, on the left-hand side menu, scroll down until you see **Pricing plan** section. There you uncheck the Lite plan option.

[![](https://katzmax.files.wordpress.com/2021/02/lite-plan-services2.png?w=1024)](https://katzmax.files.wordpress.com/2021/02/lite-plan-services2.png)<figcaption>Some of the Lite (free) plan services</figcaption>

I encourage you to register for the free Lite plan at [https://cloud.ibm.com/registration](https://ibm.biz/Bdfr9a) to see how these services can help you solve problems.

To learn more about how these services can help you, I’d also encourage you to follow us on [Crowdcast](http://crowdcast.io/ibmdeveloper) – where we host weekly developer education meetups.