teleren/devto huggingface dataset:
How to make Windows Terminal look like oh-my-zsh
Tags: webdev, codenewbie, tutorial, beginners
Published: 2020-11-12 11:55:17

One of the joys of working in a Linux environment is its superior terminal experience. With the wide selection of [themes](https://github.com/ohmyzsh/ohmyzsh/wiki/Themes) available in the [oh-my-zsh](https://www.freecodecamp.org/news/jazz-up-your-zsh-terminal-in-seven-steps-a-visual-guide-e81a8fd59a38/) plugin for the zsh shell -- and likewise for [oh-my-bash](https://github.com/ohmybash/oh-my-bash/wiki/Themes) for the bash shell, using the terminal in Linux can be a delightful aesthetic pleasure.

Hence switching from a Linux to a Windows environment had always come with a sense of disappointment. So it was with great surprise when I learned that it was now possible to configure Windows Terminal to look like oh-my-zsh. [The instructions can be found here](https://docs.microsoft.com/en-us/windows/terminal/tutorials/powerline-setup). And if you implement these steps in [Windows Terminal 1.5](https://www.windowscentral.com/windows-terminal-15-hits-preview-loads-new-features), hyperlinks -- which previously had to be copied and pasted into the browser -- now become clickable:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/p7rjfsbr2zz89k8r3wa4.png)

[The instructions](https://docs.microsoft.com/en-us/windows/terminal/tutorials/powerline-setup) include the installation of a Powerline font like [Cascadia Code](https://github.com/microsoft/cascadia-code). The added benefit is that, once installed, you can [use the same font](https://www.youtube.com/watch?v=qEdvWFWpOyQ) in your favorite code editor like Visual Studio Code, which can enhance your developer experience.
5 ways to skyrocket your CSS level
Tags: css, improve, projects, front
Published: 2020-11-12 11:30:34

**Hi everyone, Enzo here !**

There is not much articles talking about getting better at CSS.

Meanwhile this is a crucial pillar of the Front-End, and you need to be good at CSS, there is no way around...

So let's solve this problem by showing you 5 ways to drastically improve your CSS skills !


##**1. Create components**

Components are reusable pieces of code.
Here are some well known components that you can reproduce :

- Cards
- Inputs (date-picker, drag&drop, radio, textarea ...)
- Button (indeed, this is the most common component !)
- Breadcrumbs
- Menu (navbar, vertical, horizontal, animated, etc ...)
- Tooltips
- Pagination
- Sliders (you can do pure-CSS sliders, or just use a bit of JS to make it work)

![card ui component](https://dev-to-uploads.s3.amazonaws.com/i/hgsqp6eh6oclejib93pp.png)

Ok, I won't write down every types of component, but you can easyly find a list of the most common ones by googling : "list of ui components" for example.
Then try to replicate them using CSS ! 🔥


&nbsp;
##**2. Try harder with Flexbox / CSS Grid**

These two tools are really, really handy when it comes to place elements, you need to know them by heart, and especially the little rules that applies to them.

To train your Flex/Grid skills, you can build :

- A gallery, simple or destructured(or both!)
- A navbar
- A blog layout few lines of code
- Create amazing sections, like the flexbox animated panel.
- Everything needs to be responsive(indeed)

![grid](https://dev-to-uploads.s3.amazonaws.com/i/cnj7sl7cdzaw26bxysjv.png)


&nbsp;
##**3. Build a one-page responsive website**

Simply put :

- A navbar
- A home page
- some sections (services, contact, pricing, about us...)
- It needs to be perfectly responsive



&nbsp;
##**4. Build a website with CSS Grid as its architecture**

Here you need to build the entire structure of a website with CSS Grid, it can be a one-page or multi-pages, whatever.
You can surely use Flexbox inside of the(se) grid(s) !
![CSS Grid layout](https://dev-to-uploads.s3.amazonaws.com/i/wc8ksncscnl6vzcstgyc.jpg)


&nbsp;
##**5. Build a multi-pages website with SASS**

All right, final boss, the goals here are to :

- Build a good folders structure with SASS.
- Use extend/placeholders.
- Use mixins smartly (with parameters).
- Create and use variables.

![sass folders structure](https://dev-to-uploads.s3.amazonaws.com/i/el19mc88enakr3osmsse.png)

That's all folks !

You can find me on YouTube, talking about front development(warning, it's in French!).

YT : https://www.youtube.com/c/TheWebSchool

Take care, and see you next time. ✒️
Add image and video access on right click of the mouse on web instagram 
Tags: script, instagram, media, lifehacks
Published: 2020-11-12 11:11:13

Happy to share that I wrote a #script that kinda helps me while using web version of #instagram. The script basically adds the #image and #video access when you do a right click on that particular post. You can easily install the script by using #Greasemonkey extension.

Link to the script: 

https://gist.github.com/g-rohit/f47170c8b3b302bcbe214ba624d636bc

After u install the #Greasemonkey extention, go to this gist link and click on raw it will ask you to add. Tha's it.

Now there are lot of extentions out there to download media from IG but this is helpful when you just want to copy img & share somewhere or just paste it.

The right click with out the script: 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7g29kbxegharzcjghxov.jpg)

The right click with the script activated: 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/u3o5nq7u0fqbbh5tb4pb.jpg)

Limitations which are obvious: The media file size will be the same as of the rendered and not the original.
Go R1 Day 14
Tags: 100daysofcode, go
Published: 2020-11-12 03:58:37

---
title: Go R1 Day 14
published: true
description:  100DaysOfCode progress update
tags:
- 100DaysOfCode
- golang
---

## Day 14 of 100

## progress

- Migrated my new aws lambda logger from zap to zerolog. Zap gave me some problems initially so zerolog is my favorite structured logger right now, much simpler.
- Constructed `go-task` runner file for launching go test and go build/run.
- Structured logging required a little bit of refactor but worked.

Here's an example of providing back a logged string (don't log secrets normally, but I'm in testing phase) with structure.

```go
	log.Debug().
		Str("decodedBinarySecret", decodedBinarySecret).
		Str("secretString", secretString).
		Msg("Depending on whether the secret is a string or binary, one of these fields will be populated.")

```

Based on my improved understanding of conversions vs type assertions, the need to convert using a "cast" (Go calls these conversions, and yes it makes a copy in memory for this):

```go
log.Info().Str("requestDump", string(requestDump)).Msg("request information")
```

Type assertions are done when working with an interface.
I'm still working on my understanding of interfaces as they are their own beast in Go.
Unlike most other languages, a Go type implements an interface when all the required methods are matched.
This provides a great deal of the flexibility in Go interfaces.

The scoping of the interfaces is important, and while I listened to a lecture on this, I didn't yet work through the interface design principles to ensure the best resusability/narrowness of scope concepts.
I think that's going to take more "getting my hands dirty" for it to click.

## links

- [zerolog](https://github.com/rs/zerolog)
Day 1 with Java
Tags: 100daysofcode
Published: 2020-11-12 10:55:17


Journaling my Day 1 so far:

1. Reviewed on basics:
->Why Java is Platform independent?
Byte code (i.e Compiled code) can be run on all OS.
-> Variables, Conditionals & loops: if-else, else if ladder .

2. Solved these following basic Problems using While Loops:
-> Program to Print 1st 10 natural numbers
->Calculate the sum of 1st 10 natural numbers
->Printed Times Table for a given number
->Printed Factorial value of any number
I want to improve the reach of my LinkedIn posts
Tags: personalbranding, linkedin, strategy, marketing
Published: 2020-11-12 10:30:55

---
title:  I want to improve the reach of my LinkedIn posts
published: true
description: Let's hack your LinkedIn posts to get 10X traction
tags: personalbranding, LinkedIn, strategy, marketing 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/sd0c6z9exzxsm9lk2qd3.png

---

Today, let's talk about one of the most important tool in building an effective marketing strategy for your business - your personal brand! It has so much upside that I would suggest you start working on it even before you begin working on your startup idea.

**Using LinkedIn to build your personal brand**

To grow your brand, we primarily focus on LinkedIn. Yes, typically when you think of LinkedIn, you probably imagine outbound efforts. But that's quite time & effort-intensive, making it tough to scale.

So, building a good audience on LinkedIn through consistent posts helps you set up an inbound pipeline of leads. What's more, it is much easier to get traction on LinkedIn than Twitter.

**But, what are the steps?**

[The report](https://2.flexiple.com/no-vc-reports/i-want-to-improve-the-reach-of-my-linkedin-posts) broadly beaks it into 4 parts:

1. Content type: Of course, a clear focus on quality & type of content that aligns with your target audience as well as your interests.

2. Post structure: Getting your first line right, keeping sentences short & simple while avoiding link drops.

3. Building your LinkedIn account: Ramping your connections and optimising your personal profile for conversions.

4. Acing LinkedIn's algorithm: Using the first hour of your post smartly while avoiding external links in the content.

**Where are the hacks? Is that it?**

Of course, not. I take you deep into each of these steps which involves using tools like Phantombuster, Lempod, etc. I share examples from my experience and a lot more.

Of course, all this in 5 mins. Just [click here](https://2.flexiple.com/no-vc-reports/i-want-to-improve-the-reach-of-my-linkedin-posts) to get started.

If you would like it even shorter, I have summarised on Twitter: Tweet Link!

{% twitter 1326510803810459649 %}
Dependency Inversion Principle in Swift
Tags: swift, design, solid, dependency
Published: 2020-11-12 10:30:44

---
title: Dependency Inversion Principle in Swift
published: true
description: A brief example of how to apply the dependency inversion principle in your Swift app.
tags: swift, design, SOLID, dependency
//cover_image: https://direct_url_to_image.jpg
---

You may have heard about the Dependency Inversion principle from the OOP’s SOLID design guidelines.
The idea behind this principle is that an implementation should only be dependant of interfaces and abstractions - never of another implementation.
It also brings us the concept that a higher level module should never be dependant of a lower level module.

###Protocol to the rescue
In Swift, with protocols, you can get rid of any implementation dependency and instead rely on the implementation of a protocol.

###Real life example
Let say you have a network stack :

```
class AppServices {
	// AppServices will keep an instance of network and any other lower stack
	// that must have a shared instance. Eg: Persistence.
	static let network: AppNetwork = AppNetwork()
}

class AppNetwork {
	// This class is in charge of auth, holds the token and requests queue
	func fetch(_ operation: NetworkOperation, completion: NetworkCompletion)
}
```
And a controller that requests a list of data from an API, using the network stack :

```
class ViewController: UIViewController {
	func loadData() {
		AppServices.network.fetch(ListData) {
			self.view.refresh(listData)
		}
	}
}
```

The Network stack is a low level module, and the ViewController is tightly coupled with AppNetwork’s implementation throughout AppServices.

We can solve this dependency issue by recreating the Network as a protocol :
```
protocol Network {
	func fetch(_ operation: NetworkOperation, completion: NetworkCompletion) {}
}
```
and make the AppNetwork conforms to Network :
```
class AppServices {
	static let network: Network = AppNetwork()
}

class AppNetwork: Network { … }
```

Now, AppServices wont hold a AppNetwork implementation but an abstract implementation of Network.
Another benefit of this is you can easily mock your networks stack, simply by replacing the implementation of Network.
```
class MockedNetwork: Network {
	func fetch(_ operation: NetworkOperation, completion: NetworkCompletion) {
		completion(stubResult, fakeError)
	}
}
```

```
// make sure you set the static as a `var` and not a `let`
AppService.network = MockedNetwork()
```

Following this principle in this specific scenario is a very nice and clean way to improve the testability of any network dependant code, the flexibility and the scalability of your network stack, and you can remove any coupling of your app's controllers or view to your app's lower stacks.

I hope you enjoy this little post.
I chose to cover the dependency inversion principle as I feel it is a very useful and important principle to follow while coding and a great way to improve code and product's quality. I would be happy to answer any question in the comment section or feel free to reach via my Twitter ;)

Happy coding!
Transforming Goals into Problems into Accomplishments
Tags: beginners, motivation, watercooler
Published: 2020-11-12 10:19:26

I want to relate a conversation I had with my daughter about the intercession of goals, problems, and accomplishments to apply it to learning how to code. The basics are goals will inevitably run into problems and problems solved leads to accomplishments.

**My first tip is don’t have one goal.** The more goals you have the more opportunities you have to achieve something. The problem with being singular focused on one goal is if you fail then you are starting over from scratch. We are human. We will fail. Failure teaches us how to succeed on the next attempt. But if you have multiple goals then failure is just a setback in one area of life and a teacher for another. Imagine learning JavaScript, React, and React Native to become a web developer, mobile app developer, or a software developer. Each goal is a step toward a dream job in tech.

![journey in the mountains](https://dev-to-uploads.s3.amazonaws.com/i/cf2ef0qz8gk2ig7yxm7c.png)
**Problems are like mountains.** It’s going to be hard, takes dedication, and commitment. A lot of people fail to start their first mountain because they are intimidated by the huge one behind it. Some people failed because they are focused on someone else on the other side of the mountain. My point is there are several ways to fail but the guarantee method to possible success is to start. The mountain call learning how to code has a sharp learning curve and many valleys of errors/bugs. The best way through is to start walking (code daily), find a guide (mentor), don’t get distracted (shiny new thing), and walk in a group (meetups).

**Overcoming obstacles and achieving the impossible is the spice that makes life worth living.** Regrets are accomplishments that you didn’t at least try. My final piece of advice is to turn your dreams into goals and do at least one thing a day toward that goal. The worst you can do is nothing. The best that can happen is a dream come true. In the middle is a magical journey worth living.
Solve Hyper-v windows 10 show "Press any key to boot from CD or DVD，Start PXE over IPv4"
Tags: windows, hyperv
Published: 2020-11-12 10:14:36

Youtube Link
[![Yes](https://img.youtube.com/vi/DSNCfUrZJaQ/0.jpg)](https://www.youtube.com/watch?v=DSNCfUrZJaQ)
My first Hacktoberfest!
Tags: hacktoberfest, hacktoberfest2020, firstpost, opensource
Published: 2020-11-12 10:08:32

### Introduction 🎉

Hi, Everyone This is my first article and challenge. I will share my feelings at Hacktoberfest. 🤣

### Background 🏴

I knew Hacktoberfest last year but I don't contribute to it. I'm never contributing to open source. This year Hacktoberfest comes back again!. This time of me. 🔥

### Contributions ✨

* [data-structure-and-algorithms](https://github.com/ephremdeme/data-structure-and-algorithms/pull/185) - reverse a number
* [Ragnarok](https://github.com/Activisme-be/Ragnarok/pull/9) - added unit test
* [rando-php](https://github.com/Hi-Folks/rando-php/pull/50) - set default min max date
* [developer-community-stats](https://github.com/subeshb1/developer-community-stats/pull/215) - added my name to contributors.json
* [developer-community-stats](https://github.com/subeshb1/developer-community-stats/pull/262) - added my github .md to show in web

### Reflections 🥇

I'm very happy to contribute to the opensource. I learned how to communicate with other people, receive a connection, and participate in this event. I will keep continuing to find and contribute to another project. I hope you are not afraid to contribute to the opensource. 💕

****

for cover image -> [magic!](https://github.com/phoomparin/hacktoberfest-thailand-design-gen) 🧙‍♂️
#codevember - 12 - Bubbles animated background - Made with tsParticles
Tags: codepen, showdev, javascript, webdev
Published: 2020-11-12 09:55:00

# Bubbles animated background

**Made with [tsParticles](https://github.com/matteobruni/tsparticles)**

{% codepen https://codepen.io/matteobruni/pen/abZPJYe %}

Checkout more samples on CodePen [here](https://codepen.io/collection/DPOage)
Javascript Homeoffice Stream
Published: 2020-11-12 09:46:46

---
title: Javascript Homeoffice Stream
published: true
description: 
tags: 
cover_image: https://miro.medium.com/max/1000/1*obShOzDcFnjR1jXMyL9Flw.jpeg
---

Hey fellow nerds,

out of boredom in the homeOffice era, i started my very "unique" frontend stream. Feel free to join and chit chat.

https://www.twitch.tv/paulquappe :-)
First things security
Published: 2020-11-12 09:43:44

Security is a state of mind, not a state of things. 

Security of things cannot be achieved. Any system that is complex enough to be secured, is already broken. This is the same kind of broad sentiment as "we'll all die eventually", but it is true. Therefore, you should always start with the premise that your security is broken - then what ?

At this moment you should think about alternative plans and insurance. In a sense, insurance is the security decision that covers risks that cannot otherwise be covered, such as death.

From a technical perspective, that all security is broken, leads to two conclusions. First, you must know when to stop being paranoid and give up some of the steps that are hopeless anyway. Second, you should make your security partitioned / layered.

Partitioning a complex system into components / modules / what have you, is the ultimate analysis principle. It makes things observable, easier to reason about, modify and replace, and, in case of security, they back each other up. When you have a row of ten doors, the attacker has to break ten locks. 

On the other hand, when you partition a system, any system, it only creates an illusion that complexity disappears. Complexity, like energy, never disappears, it only transforms from one state to another. Here, the complexity goes into the interconnections. It is good when you have ten doors one after another, but in reality the parts communicate with each other in a twisted and unpredictable way. And then, another, opposite, security maxim says that the attacker must break just one door, whereas the defender must protect them all. Therefore, the more parts, the more vulnerable the system is. Catch-22.

Good luck.
Azure Websocket Timeouts on Long-Living Connections
Tags: azure, dotnet
Published: 2020-11-12 09:39:00

I've been recently working on a gateway service hosted in Azure that is primarily a TCP server. One of the key requirements of the project is that it allows clients running a desktop-based windows service to initiate a handshake over TCP when their respective service is started, and then keeps a connection open between the client and server for the receipt of messages at any given time.

However, this presented a problem. Azure doesn't like me doing this.

It seems that Azure apps (Azure Cloud Services in particular, which is what I am using), have an 'idle timeout.' According to Microsoft, this is usually between 4 and 30 minutes long, after which time, your client's connection is removed. Apparently, this is configurable.

So if like me you are using Azure, you should be able to go into the app's config settings (I believe app.config for app service or Service.Definition for cloud services) and change the idle timeout property on any endpoints you have open on the app like so.
<pre class="EnlighterJSRAW" data-enlighter-language="xml">&lt;InputEndpoint name="MyEndpoint" protocol="tcp" localPort="80" port="80" idleTimeoutInMinutes="30" /&gt;</pre>
The problem for me is, this wouldn't really fit my requirements as my clients' connections are still limited to a maximum idle timeout of 30 minutes. I want to be able to allow my clients to start their desktop service and then stay connected indefinitely.

The solution in my case was relatively straightforward. The key thing to note in the timeout that Azure enforces is the word <em>idle. </em>It only times out if the server receives zero data from a client within the defined timeout period. So sending an arbitrary command to the server keeps the connection alive.

So in nearly all cases, when my client sends data to the server, it sends a command which can be interpreted by the server, usually to perform an action and then potentially return a responding command back to the client (not immediately. We're using WebSockets remember, not HTTP!) But in this case, I can send a command I usually call 'NOOP.' (Meaning 'no operation.) The server would receive this and simply do nothing. This would automatically reset the idle timeout so that the client's connection is kept alive. You could even change the command to 'KEEP ALIVE' and have the server perform other actions based on this if needed. Simply create a task that is called every x minutes and your connection is going to stay up.

It's important to note that I am not using SignalR. I don't know if this applies to projects like mine that use SignalR, but if you are using it and this issue is affecting you, I hope this is an adequate solution for you.
Inviting frontend devs to FluidCSS! 
Tags: css, html, opensource
Published: 2020-11-12 09:27:08

![FluidCSS](https://nikhilmwarrier.github.io/fluidcss/res/fluidcss.png)

Hey there!

I used to use stuff like Bootstrap and other CSS libraries, but I noticed that there were a lot of stuff that actually wasn't used, but negatively contributed on file size and loading speeds.

Check out this video from Gary Simon at [Design Course](http://youtube.com/user/DesignCourse). This video goes more in-depth on this particular topic, and is one of my sources for inspiration.

> {% youtube bXeeMuKI2YM %}

***

Due to these reasons, I decided to create a frontend CSS framework that was focused on customisability and speed, and removing stuff that won't be used. 

After a lot of abstract thoughts, I created [FluidCSS](https://nikhilmwarrier.github.io/fluidcss). 

FluidCSS is designed to be easy to customize, and has all the basic stuff you will need, but you must code everything else yourself.

For example, there is a class to create a toggle switch, but there is no grid layout system.

This drastically changes everything. 

For one, the file size is a lot less.
Also, beginner developers will not be overwhelmed by the CSS and it will encourage them to tweak the styles.

It will also help more experienced developers to rapidly prototype their designs without worrying about re-creating the same old components or adding a new color scheme.

{% github nikhilmwarrier/fluidcss %}

Be sure to share your opinions in the comments secton!

PS: I really need contributors to this project **URGENTLY!!!**

EDIT:
Everyone is commenting about PurgeCSS. I actually meant to make something that can easily be customized, but provides enough components, like toggle switches, so that the developer can focus on more client-specific things like layouts and save time, but not end up with a generic bootstrapped website.