teleren/devto huggingface dataset:
Flexbox changed my life, bye bye boostrap
Tags: css, html, ui
Published: 2020-03-15 20:48:20

{% link https://dev.to/manangouhari/building-layouts-with-flexbox-40e %}

## Learning flexbox changed my life. 
Well, you could say it's an overstatement, but worth it.
To add a little context, I am a developer focused on backend web development, so I simply used to use a framework like Bootstrap for two major reasons - 

1. Responsiveness
2. Creating layouts using the grid system

But recently I had been getting frustrated with how ugly and generic my sites would end up looking because of Bootstrap. I knew it in me if I could conquer a beast like backend development, how tough could CSS be? This initiated my foray into the pure custom wrote CSS.

I honestly never felt that I would have fun writing CSS and designing UIs, but man it is addictive. 
When you combine basic CSS skills with a sprinkle of aesthetic sense, it's a combination worth moving people. Non-tech people can't usually appreciate what goes on at the backend of a software, UI, the frontend is all they see, the cover of the book does have quite a lasting impact.

Flexbox provided me the power to tackle both, mobile-responsiveness and making layouts through pure CSS, now I won't ever use Bootstrap unless it's forced upon me. 
Flexbox has a few core concepts, when applied top-down, help you in creating great layouts with ease.
What do I mean by applying the flexbox concepts top-down? 
Think of your whole layout as a flexbox container, then drill down on the individual components. Your navigation bar, lay it out using flexbox. Your main area, lay it out using flexbox. Information cards, yes, flexbox will help you lay them out too. 

## Resources I found most effective - 
- [DevEd - Youtube](https://www.youtube.com/watch?v=FTlczfR82mQ)
- [Traversy Media - Youtube](https://www.youtube.com/watch?v=-Wlt8NRtOpo)
- [Complete guide to Flexbox - `css-tricks.com`](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
- [The Thought Process Behind a Flexbox Layout - `css-tricks.com`](https://css-tricks.com/the-thought-process-behind-a-flexbox-layout/)

Stay tuned, I am planning to write a blog post explaining the intricacies of Flexbox.
Edit - Here's the promised blog post - {% link https://dev.to/manangouhari/building-layouts-with-flexbox-40e %}


If you find anything in this post that requires correction, please let me know. (this was a very quick and spontaneous write.)
Ruby CSV Template
Tags: ruby, rails, csv
Published: 2020-03-15 20:37:57

I refer to this #ruby #csv template at least once a week in my day job. I hope this will also become useful for you!

This template simply loops thru an assumptive group of users in a database. The template can be easily modified for your own use.

Simply modify the desired file path, the objects you would like to loop thru, and execute the following command from the the root directory of your rails app: `rails r <name_of_template>`
```ruby
require 'csv'

path = 'file_path.csv';
users = User.order(created_at: :desc);

CSV.open(path, "wb") do |csv|
  # headers
  csv << ['First Name', 'Last Name', 'Date of Birth'];

  # loop thru users
  users.each do |u|
    csv << [u.first_name, u.last_name, u.date_of_birth];
  end  
end
```
how to make custom access denied page for digitalocean spaces
Published: 2020-03-15 20:30:42

i get this message when trying to access private files. how to customize this page. 
This XML file does not appear to have any style information associated with it. The document tree is shown below.
Error
Code AccessDenied /Code
BucketName web /BucketName
RequestId t0000001a47b6cec-0 /RequestId
HostId 3cb /HostId
/Error
Getting started with 100DaysofCode
Published: 2020-03-15 20:27:46

I will be starting #100DaysOfCode with #FreeCodeCamp on #ResponsiveWebDesign today onward. I will be updating my daily progress on twitter every day for the 100 days to follow. Hope to interact with fellow tech enthusiasts and be a part of the community. My twitter handle is @adhikariarchit
Sunday summary #4
Tags: sundaysummary
Published: 2020-03-16 07:56:24

---
title: Sunday summary #4
published: true
date: 2020-03-15 20:00:00 UTC
tags:
canonical_url: https://www.mskog.com/posts/sunday-summary-4
---

[How websites evolved back to static HTML, CSS and Javascript files.](https://paramaggarwal.substack.com/p/how-websites-evolved-back-to-static-html-css-js-files-57ce549f81db)

[Tailwind for React Native](https://github.com/vadimdemedes/tailwind-rn)

[The only type of API services I'll use](https://www.rdegges.com/2020/the-only-type-of-api-services-ill-use/)

[Progressive web apps will replace your native app](https://itnext.io/progressive-web-apps-will-replace-your-native-app-4427f2df6604)

[Scaleway load balancers](https://www.scaleway.com/en/load-balancer/)
Eric & Avdi Talk About the Developer Education Business
Tags: collaborations, videos, business
Published: 2020-03-19 14:12:52

---
title: Eric & Avdi Talk About the Developer Education Business
published: true
date: 2020-03-15 19:41:21 UTC
tags: Collaborations,Videos,business
canonical_url: https://avdi.codes/eric-avdi-talk-about-the-developer-education-business/
---

[Eric Normand](https://twitter.com/ericnormand) (of [LispCast](https://lispcast.com/) and [PurelyFunctional.tv](https://purelyfunctional.tv/)) and I have been trading notes about the developer education business for years. The other day we caught up and talked about business models, subscription vs. product pricing, courseware software, and a lot more. We recorded it in hopes it might be helpful to anyone else who is in, or considering jumping into, this line of work.

{% youtube EFiRvs5ITJA %}

Topics covered include:

- Non-obvious pros and cons of selling subscription vs one-off products. 
- Courseware hosts such as [Podia](https://www.podia.com/), [Kajabi](https://kajabi.com/), [Thinkific](https://www.thinkific.com/), and [Teachable](https://teachable.com/)
- Why many of those courseware hosts have business models that favor hobbyists, not professional educators.
- The [Lynda.com](https://www.lynda.com/) business model
- Our experiences with hosted e-commerce/courseware platforms, building our own software, and using WordPress as a platform.
- The [explore/expand/extract](https://ideas.riverglide.com/3x-explore-expand-extract-b9aad6402a5a) phases of a business.
COVID-19: An opportunity for the developers’ community and Open Source Software.
Tags: motivation, opensource, discuss
Published: 2020-03-15 19:25:07

---
title: COVID-19: An opportunity for the developers’ community and Open Source Software.
published: true
description: 
tags: #motivation, #opensource, #discuss
---

Facts: COVID-19 is already a global pandemic. Many software developers and ICT professionals in general have already turned to work-from-home mode as the official guideline is to STAY HOME.

Most developers are really passionate about their job and as a result they have a really strong community that is the moving force of the software evolution. I am also pretty sure that for most developers it will be really difficult to watch tons of series and films on Netflix during the hard days of quarantine. Sooner or later they will have the need to code during their spare time in their homes.

So here are a few things (many are obvious) we can do to make the days we will pass much more time in our homes count and offer more to our community.

1. Learn a new programming language/technology or framework.
By watching youtube videos, taking courses in Udemy / Coursera / edx etc. You know the ways are infinite.

2. Answer questions in StackOverflow and other community forums.

3. Start this side-project that you always wanted to and you could not find time to do it.

4. Write tests for your existing projects (if you have not done it already). 

5. The most important one: Contribute to Open Source projects.

There are millions of open source projects out there. Find the one you like or you use in your projects, visit its repository on GitHub, check the open issues, try to resolve one and then make a pull request. I am sure that you will learn many things during the process.

# Conclusion

The time you will have to spend staying at home is a lot. Try not to waste it and spend it as creatively as you can while offering to the community too.

So what do you think? What other opportunities emerge in the community due to COVID-19? Feel free to discuss in the comment section.

 Stay Safe,
 #StayHome ,
 And keep coding : )
Just An Update
Tags: womenintech, writing, learning, productivity
Published: 2020-03-15 19:24:18

---
title: Just An Update
published: true
description: I didn't think anybody would notice, but they did. So I just wanted to say hi.
tags: #womenintech, #writing, #learning, #productivity
---

I wasn't planning on saying anything for a while, but the number of people who have reached out to me just to check in and tell me how much they learned from my writing last year has been surprising. I'm honestly still surprised how many people noticed it's been a while since I posted anything and that makes me stupid happy.

There's no big secret around where I've been this year. I got a new job, had some cool opportunities pop up that I'm still learning to manage, and just had some personal growth. So that's why you haven't seen me post as much as I used to. I plan on starting up again soon, probably tomorrow!

One thing this showed me is that the tech community is different from the internet community at large. Y'all actually care sometimes! Thanks for showing me that because most of the time it doesn't feel like it. Thanks for the support over the past few years as I've learned how to be a better writer and tech person.

I have some cool projects I'm working on this year that I hope to let y'all know about as they go. If you're interested, I still put stuff on [Twitter] (https://twitter.com/flippedcoding) from time to time.

But thanks again for noticing and I'm glad my stuff has actually helped people!
Gem markdown_helper: 20,000 Downloads
Tags: ruby, markdown, documentation
Published: 2020-03-15 19:11:33

---
title: Gem markdown_helper: 20,000 Downloads
published: true
description: 
tags: ruby, markdown, documentation
---
My gem [markdown_helper](https://github.com/BurdetteLamar/markdown_helper#markdown-helper) has reached 20,000 downloads!

Thanks to all users!
Do you like interactive tutorials?
Tags: help, discuss, tutorial
Published: 2020-03-15 19:08:28

By interactive tutorial I mean, tutorials that contain unit tests for the tasks that you are supposed to achieve in that tutorial. One example is [LearnYouNode](https://github.com/workshopper/learnyounode). It is a tutorial series containing 13 problems that teach you Node.js

![Learn You Node Image](https://camo.githubusercontent.com/17955d1d684a9a0b3fd9d5d863393e6e952cc3b4/68747470733a2f2f7261772e6769746875622e636f6d2f72766167672f6c6561726e796f756e6f64652f6d61737465722f6c6561726e796f756e6f64652e706e67)

Each problems has fixed task(s) that you need to complete and there are unit tests in place to check whether you've completed the tutorial properly, there is no guessing work.

So, do you like such tutorials? Have you ever seen similar ones? I'd really like to know.
#Day3 and #Day4 of "100daysofcode" Challenge
Tags: 100daysofcode, mongodb, reactnative
Published: 2020-03-15 19:06:30

Hi, I hope everyone's doing great.

Just a small update on my "100daysofcode" Challenge.

This is regarding Day 3 and 4. In my previous post, I stated that I have decided to work on Instagram clone and React native.

I had some trouble doing that. The main issue was I was struck with tutorial hell without even realizing it.

For some of you who were not aware of tutorial hell, Its a mistake that all junior developers make when learning to code. They'll simply start from scratch for learning each language or frameworks without even realizing it. This happened with me on react native as I completed two tutorials but still haven't understood some of the core concepts.

So, As far as react is concerned I'm just going to build the Instagram clone and going to learn those concepts along the way.

Also, On the backend side of things (MongoDB). Things are going smoothly just now completed the DB modeling.

So, yeah Don't get obsessed with tutorials just build it.
Asdf yarn install global package fix
Tags: productivity, webdev, tutorial
Published: 2020-03-15 18:50:00

Hi everyone,

Today I want to write about how to fix yarn global install of a package.

What is that Wolfiton?

If you remember from my previous articles that `yarn` and `npm` can install a package globally so that you can use it from anywhere in the system or locally you will have to specify where you have it installed.

So for our example let's use `yarn global add serve` in an asdf yarn configuration.

The package will get installed but when we go and run `serve` nothing happens or we get the unrecognized command.

To fix that we need to run `asdf reshim nodejs`.

Now if we try to use `serve` we will get the following output:
```shell
 serve                                                                                     ✔  at 20:44:45 

   ┌───────────────────────────────────────────────────┐
   │                                                   │
   │   Serving!                                        │
   │                                                   │
   │   - Local:            http://localhost:5000       │
   │   - On Your Network:  http://192.168.1.145:5000   │
   │                                                   │
   │   Copied local address to clipboard!              │
   │                                                   │
   └───────────────────────────────────────────────────┘


```
It is working!
To exit the serve command **Dear Reader** press `Ctrl + c` or `command + c`
I hope you enjoyed the article **Dear Reader**
Also if you find it useful, share it on social so others can enjoy it too.
Getting Started with Create React App
Tags: react, beginners, tutorial
Published: 2020-03-15 18:43:53

Every week I'm writing a new blog post and most of the time I find myself writing about JavaScript and React. Instead of telling my readers to "Google it", I'm just going to write this blog post to link them when I talk about creating a React App!

###Node Version###

We first need to verify what version of Node and NPM your local machine is running. Go ahead and enter the following in your command line:

```
node -v && npm -v
```
You'll need at least **Node v6** or above and **NPM v5.2** or above (to use npx instead of npm) for `create-react-app` to work.

###Creating the React App###

Now you can create your React App! Head to the directory you want to create it at and run:

```
npx create-react-app playground
```

Keep in mind 'playground' can be changed to anything you want. This is just the title of your app. It will take a moment to install all the dependencies to run and build.

###View Your Scripts###

Now we're going to change directories and see the template React has created for us

```
cd playground
npm start
```

A new browser should open up with your new template! You're now ready to get started on your first React App. Please see [my other blog posts](https://dev.to/superhackerman) on more things React :)
Containerized Travis CLI
Tags: docker, travis, cicd
Published: 2020-03-15 18:41:27


[travis-ci.com](https://travis-ci.com) describes itself as "The simplest way to test and deploy your projects."

Travis offers a cli to interact with their services. That's great! We can use it to script functionality instead of manually executing and clicking in the UI every god damn time.

I am no fan of installing various packages with different package managers all over my workstation. I am a big fan of container technology however and use travis-ci for most of my projects on github.

Since I am an outspoken advocate of container technology and use travis-ci for most of my projects on github I put travis' cli in a ruby based container. This container is available in two flavors, either with a fixed version or with the latest and greatest travis cli release. The source code is available on [github.com/ckaserer/docker-travis-cli](https://github.com/ckaserer/docker-travis-cli).

If you need to read up on what travis cli can do for you, here is the link you seek
* [https://github.com/travis-ci/travis.rb](https://github.com/travis-ci/travis.rb)


### Preflight

Okay, the whole point is to avoid installing travis cli on our workstations. To avoid local installation we will use container technology as our abstraction layer.

Therefore we will need to install a container runtime. Please install `docker` on your workstation if you haven't done so already.

In order to make it easier to use travis as a container a few bash functions are available in the `bashrc` of the git [repository](https://github.com/ckaserer/docker-travis-cli). I really recommend that you source the [bashrc](https://raw.githubusercontent.com/ckaserer/docker-travis-cli/master/bashrc) - it abstracts away all the options and parameter used in the docker command for you. In the next section you will see why.

```
source bashrc
```

However it is not just black magic - all commands that are available via the bashrc in this repository will be printed before execution to increase transparency.

---

### Run your travis cli command in a container

Just like you would run your travis cli command locally you can do so with the `bashrc` function `docker-travis`. e.g. to get the cli version of the `travis-cli` image you are using simply run

```
docker-travis travis version
```

which wraps following command for ease of use

```
docker run --rm -it -e TZ=Europe/Vienna -v /home/myuser/.travis:/root/.travis -v /home/myuser/path/to/your/current/directory:/root ckaserer/travis-cli travis version
```

As you can see the container you are using is deleted after it ran with `--rm`, set the timezone to Europe/Vienna, mount your current directory into the container to inject updates into files in your git repository. e.g. you want to add a slack token to your `.travis.yml`.
Translating life habits into software: Couchified
Tags: node, productivity, life, hacks
Published: 2020-03-15 18:00:48

I'm almost comfortable saying that most of revolutionary ideas out there became "revolutionary" thanks to their capability of solving problems. Same goes for software. 

## The Problem
As i human being, i love to end my days on my couch, watching some TV shows from Netflix or Prime Video. I'm that kind that doesn't fall asleep while watching a movie, but once it finishes all i want to do is turning off the light. At the moment my setup does not include anything that makes my TV "smart". Content are streamed to my TV through HDMI cable, hence once i finish my movie i have walk to the PC to turn it off.

#### TL;DR 
I'm too lazy to get off the couch.

![Me at the end of the day.](https://media.giphy.com/media/cuPm4p4pClZVC/giphy.gif)



## The Solution
I wanted to create a simple hassle-free tool with nothing to install and capable of running basically everywhere. 

Here is where **Couchified** was conceived. 

You just start it on the host you want to control, and __TA-DA__ you can control it from any other device capable of running a browser on the same network. 

**That's it!**

![Me after Couchified.]
(https://media.giphy.com/media/31tHnjdJRR20M/giphy.gif)

You can try Couhified here: 
[https://www.npmjs.com/package/couchified](https://www.npmjs.com/package/couchified)

Of course this is just one of my side projects along with regular job, and it "just works".
There might be lot of work to do if someone would join my cause helping me being lazy! :sleepy:

Every comment is appreciated!
CanCanCan 3.1.0
Published: 2020-03-15 18:37:30

Hi all :wave:,
a new version of [CanCanCan](https://github.com/CanCanCommunity/cancancan) is out!

This is a minor release with small but important improvements.
Please read the whole [CHANGELOG](https://github.com/CanCanCommunity/cancancan/blob/develop/CHANGELOG.md).

First of all: we have a logo!
<img src="https://github.com/CanCanCommunity/cancancan/raw/develop/logo/cancancan.png" width="100">
Thanks again [Renuo AG](https://www.renuo.ch) for the big support.

The biggest improvement in this version is on how we generate the queries when you use `accessible_by` helpers. Instead of the distinct clause, [we now prefer an inner query](https://github.com/CanCanCommunity/cancancan/pull/605). This solves many issues when you have more complicated queries. It also allows you to use CanCanCan [even if you have JSON columns](https://github.com/CanCanCommunity/cancancan/pull/608).

We also have a better support for I18n and translation of the error messages.

Have fun!
100 Web Project Ideas
Tags: webdev, javascript
Published: 2020-03-15 18:26:08

[Originally posted here](https://efficientuser.com/2020/03/15/100-web-project-ideas/)

Whenever I start learning a new Language or Framework, I used to create small apps or programs to practice.

Always, I try to build ToDo app if I learn Web Framework or random number generator if it a programming language and guess the number game.

I wish to build a list of items to help beginners to practice when they are learning something new.

So here is my contribution.

I have created a GitHub repo to list *100 Web Project Ideas*

{% github PandiyanCool/100-project-ideas %}

I wish you should help me to reach this list to reach more people who actually in need.

Feel free to star or fork or send PR to the repository.

And if you are using Twitter, send me hi to motivate me. I love it.

Here is a twitter thread I have created to reach more Devs.

{% twitter 1239112323693871104 %}

That's for now.
If you are reading or trying this, do let me know. I will be very happy.

Cheers, Happy Coding!
Character set and Character encoding
Tags: characterset, encoding, ascii, unicode
Published: 2020-03-15 18:12:55

Machines understand 0s and 1s. Character sets are created to convert characters between machine code and human-readable symbols. For example, the character **`a`** will be encoded based on the character set when it is stored in memory. And when the character is displayed, a decoder is used to convert the content in the memory into a human-readable symbol.

ASCII is one of the character set which represents a character in 7bit. Since it uses 7 bits, there can be 2^7, 128 characters represented in ASCII. ASCII contains only English alphabets

So with ASCII, character `a` will be stored in its binary representation of  `01100001` which is 97 in decimal which is the character code of `a` in ASCII.

Unicode was created to have a universal code for almost all characters across all languages in the world and some commonly used symbols. Unicode uses 1 to 6 bytes. To encode and decode Unicode characters, different techniques were used like UTF-8, UTF-16, UTF-32, etc.

- In UTF-8 each character is encoded into 1 to 4 bytes ( the dominant encoding )
- In UTF16 each character is encoded into 1 to two 16-bit words and
- in UTF-32 every character is encoded as a single 32-bit word.