teleren/devto huggingface dataset:
How to learn programming? - A developer's perspective
Published: 2021-08-03 11:53:13

---
title: How to learn programming? - A developer's perspective
published: true
date: 2021-08-03 10:58:47 UTC
tags: 
canonical_url: https://livecode247.com/how-to-learn-programming-a-developers-perspective
---

So, one of the biggest hype in today's world, is coding or programming. Everyone is trying to learn how to code. People are willing to pay to teach their children how to code. But does it have to be that way?

Learning to code can seem like a very daunting task with so much to learn. Programming is a whole new world and even the best of developers touch only the tip of the iceberg. So here's how to learn programming, from a developer's point of view.

## Spending Money should not be your first option

So, there are a lot of paid courses out there related to programming. Even though, some of these might be good quality, there are a lot of free resources out there to get you started. You might even never have to pay to learn to code, to be honest. One of the best resources out there is [Youtube](https://youtube.com). Since this is not a blog post specifically citing resources, i will not list any down here. But I might make one later regarding the same.

## Ask for help when you need, and help others when they need

The programming community is a big one. That is one of the reasons why any problem you might come across, there is a solution for the same 99% of time, out there on the internet. If there is not, ask people. Ask people you know, who might be able to help. If not, places like [Stack Overflow](https://stackoverflow.com/) is a really good community driven forum for this.

## Understand basic concepts and get them strong

Whatever programming language you choose, get your basics strong. Do not skip directly to the big frameworks and libraries. That won't help. You need to understand the core concepts of programming and again a point to note is that, you need not know everything. You tend to learn stuff as you progress but you can only do that if your basics are strong.

## Build Projects

One of the approaches which always has worked for me, when I am trying to learn a new programming language or framework, is to build projects. Yes, you will come across a lot of difficulties during this process, but you learn a lot trying to overcome these difficulties. Your project need not be perfect. It may have a lot of flaws. But, you can always go and better parts of the project which you think need improvement. And the project can be as small as a todo list or as big as a e-commerce app.

## Keep learning

Learning doesn't take a stop after learning a programming language and creating a project with it. There are a lot of things you can still learning. You can learn more about the language you already learnt. You can try new frameworks or libraries.

So, that brings us to the end of this article. I might make a blog post specifically about how to learn web development in the near future. But I hope this would have inspired you to take a step forward to start learning about programming.
I made a Vue CLI MPA
Tags: vue, mpa, showdev
Published: 2021-08-03 10:50:48

# A Vue MPA
I decided to create a Vue MPA with Vue CLI for fun, together with a search on GitHub and NPM function (REST API).
Here you go:
[https://det171.surge.sh](https://det171.surge.sh)
Source code:
[https://github.com/DET171/home](https://github.com/DET171/home)
{% github DET171/home %}

P.S. The tutorial included is just for fun.
P.P.S. Please comment on how you think!
Conference's program
Published: 2021-08-03 10:04:04

**[DevTernity](https://devternity.com)** — the main developer conference of the year is finally here:

[![Conference program](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g0x6n6djp4aojkc5tv3e.png)](https://devternity.com)

➡️  Get your ticket now and save 200€: **https://devternity.com**

[![DevTernity call for action – are you in?](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u6tcga2hsy3x0vgsnexb.gif)](https://devternity.com)
Docker Volume on NFS?
Tags: docker, tutorial
Published: 2021-08-03 10:03:21

No Problem. Did you know you can have your volumes on nfs server? Yes i know you can mount NFS folder on server and then on point docker volume to this folder, but i will show you
how to mount volume right with docker. Btw you can read more about docker storage on [official docker documentation](https://docs.docker.com/storage/). As prerequisity you will need to have installed NFS server.

Now you can run docker image with volume pointed to your nfs server

```bash
docker service create -d \
    --name nfs-service \
    --mount 'type=volume,source=nfsvolume,target=/app,volume-driver=local,volume-opt=type=nfs,volume-opt=device=:/var/docker-nfs,"volume-opt=o=addr=10.0.0.10,rw,nfsvers=4,async"' \
    nginx:latest
```

If you want to mount nfs volume right in your docker-composer (docker-composer file **version 3.2** and up is required) then you can do it as follows:

```yaml
version: "3.9"

# ...

services:
  wordpress-app:
    # ...
    volumes:
      - wordpress:/var/www/html

volumes:
  wordpress:
    driver: local
    driver_opts:
      type: nfs
      o: addr=server_ip,rw,vers=4.1
      device: ":/path/to/nfs/folder"
```

* `device`: is full path to your folder, it coresponds with path in your server's nfw export config
* `addr=server_ip,rw,vers=4.1`: Change server_ip to your server ip address, `rw` gives container both read and write access to the nfs mount, `vers` tells to docker which verison of NFS to use. 

If your container needs root access to the folder do not forget add `no_root_squash` to you exports as server by default translating all rood operations on remote server to the non privileged user because of security.

For what it is all good? For sharing data between containers. For example if you know Gitlab and their gitlab-runner. You can make it autoscale or you can have them more. When you do this you will need to share build chache otherwise you will run to errors when you trying access cache form runner that is diferrent than that one which wrote cache file ;)

I recommend this to use for storing files like images or website files (like on wordpress) but not database. You newer know how database server reacts when you mount will disconnect, it will cause datafile corruption and you server hang on start. If you need more than one Database server with same date then you will need configure replication.

Originally posted on [themaymeow.com](https://www.themaymeow.com/en/posts/2021/07/docker-vulume-on-nfs/)
Thats all. Bye!
Melhor uso de true, false e nil em ruby
Tags: ruby, performance, beginners, optimization
Published: 2021-08-03 09:45:40

Na maior parte das linguagens **true**, **false** são opostos, e **nil** é como se fosse o oposto a tudo.
Mas isso não é absolutamente verdade em ruby.

```
1.kind_of?(Integer)
# => nil
!1
# => false
!nil
# => true
```

A razão para esse comportamento é **otimização**, por exemplo, se você quer apenas executar um código no caso de determinado método alterar um objeto, você poderia utilizar uma condição como esta:

```
string = "..."
if string.gsub!('a', 'b')
  #string was modified
end
```

Em casos como este, você não consegue utilizar métodos em cadeia (**method chaining**) com segurança, afinal, no caso da condição não ser verdadeira, ele retornará **nil** e a exceção **NoMethodError** será disparada

```
string = "cde"
string.gsub!('a','b').downcase!
# => NoMethodError (undefined method `downcase!' for nil:NilClass)
```

## Memoização

Ao usar o operador **||=** como operador de memoização deve ser ficar atento a expressões que retornam **nil** ou **false**

```
@cached_value ||= some_expression
# or
cache[:key] ||= some_expression
```

Exemplos como o acima servem para a maioria dos objetos em Ruby, nesse caso, o valor padrão de **@cached_value** é **nil** e enquanto **some_expression** retorna um valor que não seja **nil** ou **false**, isso será chamado apenas uma vez.

No entanto, no caso de **some_expression** retorna **nil** ou **false** ele continuará a ser chamado até que o retorno da expressão não seja **nil** ou **false**, e este é um comportamento indesejado quando estamos trabalhando com objetos memoizados.
Por isso quando você quer armazenar em cache uma expressão que possa retornar **nil** ou **false** você deve utilizar uma abordagem diferente.

No caso de uma unica variável de instância para o valor 'cacheado', pode-se simplesmente utilizar o método **[defined?](https://ruby-doc.org/docs/keywords/1.9/Object.html#method-i-defined-3F)** para checar se ela existe, apesar disso resultar em um código mais verboso:

```
if defined?(@cached_value)
  @cached_value
else
  @cached_value = some_expression
end
```
Se você está utilizando hash para armazenar múltiplos valores, pode-se utilizar o método **[fetch](https://ruby-doc.org/core-2.5.1/Hash.html#method-i-fetch)** junto de um bloco no caso do valor não for encontrado:

```
cache.fetch(:key){cache[:key] = some_expression }
```

Outra vantagem em se utilizar **true**, **nil** ou **false** é que eles são tipos de objetos imediatos, ou seja, não requerem alocação de memoria para serem criados e não criam indireção de memória para serem acessados (memory indirection é quando uma alocação de memória aponta para o endereço de outra alocação e assim por diante)
My Experience Converting Django Template to ReactJS
Tags: programming, oop
Published: 2021-08-03 09:41:48

During my time at MEGASAP, July 2021, they have given me a task to convert the existing Django templates for their attendance tracking dashboard for employee and employer to React due to scalability and better UX in the future. However, they do not want to buy or have another server just to host React front end, so I need to include React directly in Django as an app using "django-admin startapp" command. 

Since the React embedded in Django application, I cannot use the common "npx create-react-app" way because the common way will generate the files that might not be accessible in Django statics. So, I need to combine certain library and using Webpack to compile all the Javascript file into one main file (main.js) and directly put the "main.js" into Django static folder.
To enable developing the front end using React, these are the front end tools I need to get set up:

1. Webpack ⇒ setting up the Javascript, SASS, CSS, Images and others file compilation into a single "main.js" file and output the file into Django static folder.
2. Babel ⇒ to enable the latest Javascript syntax being convert into older version so that old browser can access the content.
3. React, React Router, React Hooks ⇒ the typical React library for developing the React application, together with front end routing system and global state management using Context API.
4. Others React Library ⇒ React i18n for internationalization or language translation, React Helmet for dynamically changing the <title> or any <head> tag based on any condition given.
5. Other Library ⇒ axios for fetching the data through API from Django Rest Framework.

As for backend, which is the Django, the API need to be built since all the communication for Django to React through REST API. So, the Django Rest Framework has been used.

Working at MEGASAP for a short while really give me some new experience on how to work with React and Django, and how to start a React application without any boilerplate.
My Laptop Speed is Low and Hang after Some Time
Tags: hanglaptop
Published: 2021-08-03 09:40:53

Recently I've experienced issues with my laptop speed and performance. Since then, I have spent a lot of money on various troubleshooting tools and instructions online. Nothing seems to work. I have tried some basic things like a virus scanner and defragmenter and the only thing that has helped me is a specialized registry cleaner. The problem with my laptop speed was the fact that it hung after some time. In the past, I had been getting average laptop speeds but recently I've been seeing random error messages and pops when starting up and closing down the system.

To start off, you need to make sure that your computer's power source is turned off. If your computer doesn't have a back up battery, you need to try to reset it to its original position. Then I disabled extra features and configured the computer to the slowest speed possible. <a href="https://www2.turkishsub.su/series/">
turkish series in english subtitles 
</a> After these things, I was still having problems with my laptop speed.
Do you want to reduce the number of your PHPotential bugs?
Tags: php, elephpant, phpmascot, phpaddict
Published: 2021-08-03 09:39:30

The plastic duck method, also called the rubber duck method, is a source code review practice used in software engineering in the debugging phases.

Reference >> Andrew Hunt and David Thomas' book: The Pragmatic Programmer: From Journeyman to Master, published in 1999

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tgcpyt119kket7s88mpj.jpg)

The plastic duck method involves meticulously explaining the source code that you have written to a plastic duck or your favorite elePHPant. Just expressing your thoughts out loud is supposed to help find PHProgramming errors.
It's PHProven ... you can reduce bugs by up to 100%!

#php #elephpant #antibug

Order your anti bug elePHPant now!
https://www.vincentpontier.com/elephpant/produit/elephpant-blue-original/

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3hjeok7qb3j7150jmq85.png)
Online Sarkari result - All competitive exam 
Published: 2021-08-03 09:38:55

Sarkari result is one of the best job platform. you can find state level and central level government exam  such as UPSC, GPSC and SSC, Army, Navy and Air force officer recruitment news. also check Admit card, Sarkari result in this website

https://www-sarkariresults.com/
How To Enable Real-Time Merge Conflict Detection in VS Code
Tags: vscode, programming, productivity, git
Published: 2021-08-03 09:36:31

Ah, the dreaded *resolve conflicts* message. You've finished crafting the perfect code, just a quick merge in of master  (ahem, *main*) before you submit your PR, and then... 💥

![image-1-updated.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627640616766/XPQfCdYI3.png)

If only there was an early warning system for merge conflicts so you could be better prepared or even avoid the conflicts in the first place I hear you say? Well if you are a VS Code user today is your lucky day!

Firstly, you'll need to install and set up [GitLive](https://marketplace.visualstudio.com/items?itemName=TeamHub.teamhub), then you should see this icon in the top right-hand corner. 

![colour toggle full.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627667202435/pZaRYmSSw.png)

It will be disabled if the file open in the editor is not from git or there are no other changes to it from contributors working on other branches (aka you are safe from conflicts). If it's enabled there will be one or more change indicators in the gutter of the editor. 

![image-3-2200x1200.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627557380368/lUMGbUDSH.png)

These will show you where your teammates have made changes compared to your version of the file and even update in real-time as you and your teammates are editing.


![GL-gutter-4000.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627652753721/ypYzQqcEA.png)


If you've made a conflicting change you will see the bright red conflict indicator. These conflicts can be uncommitted local changes you have not pushed yet or existing changes on your branch that conflict with your teammates’ changes. 

Hover your mouse over the code in the affected lines to see the diff between your version and theirs, the branch the offending changes are from, and the issue connected to that branch if there is one. 

![conflict popup 2 full.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627667291312/iyynKT4dH.png)

From this popup you can also cherry-pick your teammate’s change directly from their local version of the file. For simple conflicts this can be a quick way to resolve them as identical changes on different branches will merge cleanly. 

Unfortunately, it's not always possible to resolve a conflict straight away but with the early warning, you'll be better prepared, avoiding any nasty surprises at merge time! 

Check out this [blog post](https://blog.git.live/gitlive-11.0-Real-time-merge-conflict-detection) or the [GitLive docs](https://docs.git.live/docs/mergeconflicts/) if you want to learn more.
3 Best Courses to Learn React Native For Free
Tags: reactnative, react, mobile, javascript
Published: 2021-08-03 09:35:52

## Introduction 

If you want to work on open-source software that runs on the majority of devices across the world, React Native is an excellent choice.. You've come to the correct spot if you want to study React Native right now and are seeking the greatest online courses, training materials, tutorials, and classes. 

BTW, if you would like to learn React Native in-depth and are searching for additional in-depth online courses, I recommend Mosh Hamedani's The Ultimate React Native Series

![screely-1627981375314.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627981385977/bGHXUow3W.png)

## 3 Best Courses to Learn React Native For Free in 2021

####  React Native Tutorial for Beginners - Academind

This is the free version of the React Native course provided by Maximilian Schwarzmüller on Udemy. It is the perfect course for the beginner to help them get started with React Native. This free course consists of 6 hours of content. For this course, you will just need a basic knowledge of React Native and JavaScript. In this course you will learn about building a React Native component, working with React Native core components, how the component works,  styling your component, adding navigation and etc. 

Link: https://www.youtube.com/watch?v=qSRrxpdMpVc

![screely-1627982105645.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627982113732/BPOpGvpfC.png)


####  Intro to React Native build a cryptocurrency tracker app - Bryan Ellis

This course teaches you how to build business savvy applications that will make your users love using them! Bryan Ellis has built numerous applications for companies and learned what it takes to build great ones and thrive in the software development community, if you follow along in this course you will have a great understanding of building awesome apps and the structure you need to maintain great apps and constantly improve them!

Link: https://www.udemy.com/course/ultimate-react-native-with-firebase/

![screely-1627982269509.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627982277059/BxgG9Eayf.png)

####  Create a tiny app with React Native - BCoding Revolution


In this course, You will create a tiny React Native application so you can get started and realize that creating apps is super easy with React Native. The app calls "Who pays the bill ?", the user can create a list of players and at the end, you will randomly pick one and show the Looser. On this course you will practice validation, toasts, state with context, 

Link: https://www.udemy.com/course/create-a-tiny-app-with-react-native/


![screely-1627982979220.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1627982997863/pR7_LnKo8.png)


## Conclusion

I hope you found this article helpful. If you need any help please let me know in the comment section

Let's connect on  [Twitter](https://twitter.com/suhailkakar)  and  [LinkedIn](https://www.linkedin.com/in/suhailkakar/)  

👋 Thanks for reading, See you next time
Using Dart Extensions to Decouple Mappers in Big Flutter Projects
Tags: dart, flutter
Published: 2021-08-03 09:35:26

Working on big flutter projects introduces lots of bottlenecks. The general method of creating entity mappers and json converters in entity classes are no longer the best approach when working on big projects. 

Typically, an entity class in big flutter projects may need to have several mappers to other classes as well as Json converters and/or other types of data. This introduces readability issues and presents difficulty when trying to refractor existing code. 

This is how a typical user class in many flutter project looks like

{% gist https://gist.github.com/wizardoma/19b61426cf9046b07d6501490c83edac %}

We can see lots of things are going on in this class. Removing or adding new fields may lead to lots of refactoring in this class and/or other classes. 

**Introduction Dart Extensions**
From dart docs, Extension methods, introduced in Dart 2.7, are a way to add functionality to existing libraries.

Dart extensions solves this problem by decoupling mappers and converters to a separate responsible class.

Changes in User properties that affects mappers and converters will only be refactored in the decoupled mappers. 

Create a UserMapper class as this 

{% gist https://gist.github.com/wizardoma/4e017e9c45a217a145f17d758f661a34 %}

Our User Entity is now simplified as this

{% gist https://gist.github.com/wizardoma/42a3a815c41e96e1862f32670b3317b8 %}


With this better approach, changes will only be effected in our various mappers and will ensure a cleaner error-prone entity classes.

Want to know more about Dart Extensions? 

[Check out this dart documentation](https://dart.dev/guides/language/extension-methods)

Thank you for your time :)
5 completely FREE Tailwind CSS UI kits for you to use in your project
Tags: tailwindcss, css, html, easyui
Published: 2021-08-03 09:04:38

---
canonical_url: https://www.easyui.dev/sid/5-completely-free-tailwind-css-ui-kits-for-you-to-use-in-your-project-3i34
---
Let's jump right in. You don't need an introduction as you probably already know what Tailwind CSS is 😁😁😁.

*PSST...Just a quick note before we start. In all these resources you can copy and paste Tailwind CSS components into your code, which is very helpful if you want to build a website fast.*

## 1. [Tailblocks](https://tailblocks.cc)
![TAilblocks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yb8u6o0fxdz15jkfgj2a.jpeg)
I used this first, so I have a special preference for Tailblocks. Tailblocks is easy to customize and has different types of blocks you can choose from, ranging from CTA's to navbars.

## 2. [Wickedblocks](https://blocks.wickedtemplates.com)
![Wickedblocks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8ouk5ogofrzsr322e3sx.jpeg)
Wickedblocks is another amazing and easy to use Tailwind CSS resource. Wickedblocks has its own unique style so I recommend checking this out if you want something different from Tailblocks

## 3. [Meraki UI](https://merakiui.com/)
![Meraki UI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6kdp1lvv9ef9n65154gg.jpeg)
Although Meraki UI has overall less Tailwind CSS components than Wickedblocks and Tailblocks, it more than makes up for it with RTL support, something which the others do not have. So if you want RTL support in your website, here's the way to go!

## 4. [Kometa UI kit](https://kitwind.io/products/kometa)
![Kometa UI kit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/enqosmdjc5ruofdpno6r.jpeg)
Kometa UI kit is really the best UI Kit I have seen. It has over 130 sections built with Tailwind CSS, built for those who need choice!

## 5. [Mamba UI](https://mambaui.com/)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s9hofplt8a77pnq4ksn7.jpeg)
Mamba UI is a nice collection of Tailwind CSS components, and great in all aspects.

## A special mention to [Tailwind UI](https://tailwindui.com)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fn0jaq5cmha18xh915j5.jpeg)
Ok. I had to put this, because it's not free, but 
a great resource for those willing to pay. It's by the creators of Tailwind CSS themselves, so it is definitely worth its premium value. 

#### Thanks for reading. I hope this post added some value to your life. You'll get more content like this on the [Easy UI forem](https://easyui.dev) - a community all about building websites and the stuff involved, mostly from a frontend perspective..