teleren/devto huggingface dataset:
app.js clashing with other js files in laravel
Tags: laravel, javascript
Published: 2021-07-24 12:52:03

You are probably here because some aspect of your laravel javascript dependent webpage isn't displaying properly as it should because you think that some js files included in your layout/home page(e.g layout/app.blade.php) for example, are somewhat clashing. Here is a quick solution

The problem could be because of the default laravel `app.js`. Sometimes, removing `defer` flag from the `app.js` script tag will work but it may be that there is this other aspect of your laravel web page that depends on it, especially if you use vuejs in your laravel app.  So in that case, you would want `app.js` and `others_scripts.js` to be included. 

Three quick solutions:

## Solution 1
1. ### Remove the `defer` flag from the script tag.
from this:
``` 
   <script src="{{ asset('js/app.js') }}" defer></script>
```
to this:

``` 
<script src="{{ asset('js/app.js') }}"></script>
```

## Solution 2
2. Make sure that you do not include either the minified or unminified `jquery` script file. Something like this 
```
 <!-- jQuery -->
    <script src="{{ asset('assets/js/jquery-3.6.0.min.js') }}"></script>
```
Please you have to remove it as the default laravel `app.js`  will do!!!


## Solution 3 (Ideally the effective in most cases )

Delete "defer" from js/app.js and all another scripts write after js/app.js

```
 <script src="{{ asset('js/app.js') }}" ></script>
    <!--  Jquery scripts -->
 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
 <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <!--  your  scripts -->
<script src="{{ asset('js/script.js') }}"></script>   
```
This is solution was culled from a thread in an [open issue](https://github.com/laravel/framework/issues/28984#issuecomment-541344540) on the official laravel github repository.


All the best!!!
CS50x 2021 - WEEK 6 (PYTHON)
Tags: computerscience, cs50, python, beginners
Published: 2021-07-24 12:40:12

Finally done with Week 6 of Harvard's CS50x course which was about `PYTHON`.

It was basically a quick intro into python syntax and conversions of some programs we wrote in former weeks(in C) into python to teach how python works.

It was very straightforward and simple to follow probably because the language is a lot easier to work with than C especially not needing to handle memory allocation and not defining what data type your variable is explicitly.

The [problem](https://cs50.harvard.edu/x/2021/psets/6/) set for Week 6 was to convert some of the previous problem sets we had done in C to Python...and another problem set called 'DNA' where we had to implement a program that identifies a person based on their DNA, It was pretty straightforward mostly except where you had to make a function that returns the longest consecutive repeats on a particular string in another larger string. I struggled writing that manually until i looked into `ReGex` in python which made it very easy with just a few lines of code.

It's nice to know about a new language, I will try to use it whenever I can like when doing LeetCode/HackerRank problems, I used C++ previously.

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8txqrthnx5v7c5gsbzel.png)

Moving to Week 7 (SQL).
Day 151
Tags: 100daysofcode, programming
Published: 2021-07-24 12:11:16

Day 151/200 of #200DaysOfCode #100DaysOfCode 

- Solved three problems on Codewars.

1 - Speech to Text - String Manipulation (6 kyu)
2 -  Total Time (6 kyu)
3 -  Higher-Order Functions Series - Sort by programming language (7 kyu)
What did you teach this week?
Tags: discuss, teachingthisweek, teaching
Published: 2021-07-24 12:04:50


Today is a very Auspicious day. Here in India, today is celebrated as the day of *Guru Purnima*. On this day we all express gratitude towards our teachers. Teachers may not necessarily mean professors. Our boss, colleague, or even our juniors. Everyone teaches us in some way or the other.😇

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2whihea0a6spwrejtbdf.png)
So why don't we too contribute towards teaching? Let us all celebrate this honor of teaching others.😃 Inspired by the [Win of the week ](https://dev.to/devteam/what-was-your-win-this-week-4ojf) and the [What did you learnt this week](https://dev.to/nickytonline/july-22nd-2021-what-did-you-learn-this-week-3ck) discussion blogs, I have decided to start this 'What did you teach this week?' blog from today's occasion! 😊
 
Teaching others may not necessarily mean giving a lecture to an audience or starting a YouTube teaching channel. We are constantly teaching others, and simultaneously learning from others. 
Basically when you explain ideas to others, it counts as teaching. 😊
So if you have helped your fellow student learn a new concept, or taught your junior effective debugging, you have done the noble task of teaching.😄 Even posting answers on stack exchange is a way of teaching. Writing blogs is a way of teaching too. Are you not sharing your knowledge with others!😀

So if you too have taught anyone, anything this week, however trivial please post in the comments below. 👇

Encourage and inspire others to take on this sacred task of teaching. 🤘Let us all come together on this day of *Guru Purnima* and create a wave of positivity!✌️
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/meex73hend1ncesb8p8z.png)
Today's Daily Dose of Programming Humor
Tags: jokes, dailydeveloperjokes
Published: 2021-07-24 12:00:12

---
title: "Today's Daily Dose of Programming Humor"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
published: true
tags: #jokes, #dailydeveloperjokes
---

Hi there! Here's today's Daily Developer Joke. We hope you enjoy it; it's a good one.

![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1258ed882b0.png)

---

For more jokes, and to submit your own joke to get featured, check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/). We're also open sourced, so feel free to view [our GitHub Profile](https://github.com/dailydeveloperjokes).

### Leave this post a ❤️ if you liked today's joke, and stay tuned for tomorrow's joke too!

_This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit._

<!--
Joke text:
___Q:___ What did JavaScript call his son?

___A:___ JSON!
 -->
Test Hooks
Tags: jest, javascript, testing
Published: 2021-07-24 13:31:56

---
title: Test Hooks
published: true
date: 2021-07-24 11:59:29 UTC
tags: jest,javascript,testing
canonical_url: 
---

I’ve been using this pattern for my JS/TS code for a while now and I think it works well for creating reusable test fixture logic:

{% gist https://gist.github.com/kristiandupont/5ee57a468cf891e20fdbd8c523bde9ab.js %}

One of the hardest things about testing is establishing the context. You need test data that ideally reflects reality as closely as possible. End-to-end tests that activate the entire system are great because they work with real data but they are slow to execute and perhaps more importantly, tedious to set up. Integration tests and unit tests are much better suited for testing permutations in the logic — all the non-happy paths, all the edge cases.

I find that the code I write for such tests is more repetitive and less abstract than my general code. The reason is that I want it to be easy to understand what a failing test means. If it’s buried in a number of abstractions, figuring out what went wrong becomes detective work on its own. I remember this from C# where a common pattern with NUnit is writing test classes that inherit from a hierarchy of base test-classes. I recall spending many hours figuring out why a test would fail only to discover that the context secretly established was different from my mental model. Finding the sweet spot for succinctly setting up the necessary context in a way that makes it clear what a test is doing is a constant struggle.

There are quite a few things that I find myself doing over and over and I started writing a bunch of helpers that I would call in beforeAll, beforeEach and their matching after\* calls. Having used React hooks for a while now, this felt an awful lot like something that belonged in a useEffect hook and I decided to try writing “hooks” for my test code. They encapsulate setup and teardown of test-databases, mocks and other helpers. The name is not completely analogous and there are no [algebraic effects](https://overreacted.io/algebraic-effects-for-the-rest-of-us/) here or anything, but I do find that the pattern works quite well. A hook can easily return something that can be used by a different hook, making them composable and reusable while still making it quite easy to see in the actual test file what we’re dealing with.
Spread Operator in JavaScript
Published: 2021-07-24 11:58:03

What is spread operator in Javascript ?
Spread Operator allows you to spread out the elements of an iterable object such as Array.


Syntax : [ ... Array ]
 

When to use spread operator ?
Suppose you have a array and you want to clone it.

let x  =  [1,2,3,4,5];
let y = x;
The above code is not cloning , x sets a reference to y , if the value of x gets changed the the value of y will also get changed. 

There are many ways to can clone array in javascript

let x = [1,2,3,4,5];
let y = Object.assign([],x);

console.log(y);

//Output : [1,2,3,4,5]

Source : https://codelearningpoint.com/
Python Basics, Pythons 101!
Tags: python, datascienceeastafrica, luxacademy
Published: 2021-07-24 11:57:56

Hello all,
The fourth industrial revolution is exciting yet so challenging. Jobs of the future demand more than your ability to memorize a concept and reproduce it. As of such learning coding has become one of the most in demand prerequisites by employers as well as opportunities in the world of freelancing. It is against this background that I made one of the noblest decisions in my life to join Lux Academy and Data Science East Africa for a one month boot camp in python programming. Python is an interpreted, object-oriented, high-level programming language and I fell in love with Python because of the increased productivity it provides.
In week one of my programming class I’ve learnt a lot about python  in areas such as, data structures, variables, functions and function calls among others, which has put me a step ahead in my journey to learn python.
Another interesting experience this week has been a chance to get on the keyboard and write a program for an automatic password generator, the experience which made me put what I learnt throughout the week in to practice.
The boot camp is still on and I hope to learn more interesting things in the coming weeks. A big appreciation to Lux Academy and Data Science East Africa for organizing this wonderful boot camp.
Samuel Peter Okoci
Remove duplicates from array in javascript
Published: 2021-07-24 11:56:46

You can use filter() method to remove duplicates from array , if the index of the element gets matched with the indexOf value then only that element will get added.

let data = [1, 2, 3, 2, 1];

let uniqueData = data.filter((c, index) => {
    return data.indexOf(c) == index;
});

console.log(uniqueData);

Output - [ 1, 2, 3 ]





Source : https://codelearningpoint.com/
Store English Words while you're surfing on a WebBrowser with MateTranslate and Javascript
Tags: javascript, webscraping, cleancode
Published: 2021-07-24 11:38:10

When I am reading often we track all words that we don't know but when we consume many content, could be great have a tool to help us do this job instead.

So with this Idea I reuse an extension called Mate Translate so, to have this feature in the app you need to pay. For that reason we could make our own implementation of that.


Get the components: 
![Creating the components](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t776kxtvw1tjirfz3ail.png)

Defining validations:
![defining validations](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/54lo0y7q54m9x9gfabsf.png)

Also =>
![more](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bxnlutra7uoiyd25oxmr.png)

Obtaining the dictionary:
![get the dic](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ys8u7qyndzlf16bzezqp.png)

Creating the service:
![creating the service](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b7o3te4mdjta5939gyz0.png)

Running the service:

    Copy the code from here: https://github.com/irrefl/WordsStoringWithMateTranslateAndJavascript/blob/main/WordsCollector.js

and paste it into the web console pressing F12:
![press f12](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vu4xdx77es4v17my2vw4.png)
 
The Result:
![alt text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/264oiyn70vv5q6k25m06.png)
Day 2/100
Tags: programming, 100daysofcode, webdev, javascript
Published: 2021-07-24 11:00:03

Day 2 of the challenge started as usual, by solving problems on leetcode and hackerrank. Also revised arrays and practiced some problems on it.  Then, I went on to continue my web development course and learnt about object oriented programming in JavaScript along with prototypes. I then started working on a TV Show search project which made use of APIs and also styled it with bootstrap and some custom CSS and published it on Github and hosted the site on Netlify. Finally, I went through what I learnt yesterday. So far so good, hope that I remain consistent and cover most of the concepts in the upcoming days.


TV Show search Website Link : https://showsearch.netlify.app/
Check out my portfolio : https://aliasgarkc.netlify.app
Solution of command not found adb Error
Tags: reactnative, android, reactnativeandroid
Published: 2021-07-24 10:54:21

Hey Guys, Once again welcome to this post, Hope you are trying to run a react-native android app ( or doing Android development ) and facing this issue, And you find a solution on stack overflow but it worked only once and again you want to repeat the same steps.
For Example: If you try to run “adb devices” OR any other command and it says something like.
```
zsh: command not found adb
```

It tells that you are using zsh shell and /.bash_profile won’t work as it should. You will have to execute bash_profile every time with source ~/.bash_profile the command when you open the terminal, and it isn't permanent.

So this article will give you the correct solution to this issue and if you find this solution is helpful for you then please like and comment. (And If possible then go to youtube and subscribe to my channel “JavaScript Centric” https://www.youtube.com/channel/UC9MmyicGIveu0AId8OFAOmQ).

(Youtube Video: https://youtu.be/77Be98W8LVA)
So let’s start…..

About this Error: (command not found adb) if you have not installed adb on your system or if the path of adb is incorrect.

To check if adb installed or not open your terminal and run the below command:
```
~/Library/Android/sdk/platform-tools/adb
```
It will print the version of ADB and installation path but the only, adb is not in your user’s $PATH variable.

Condition 1: If it doesn't display on output then first installed adb.
Condition 2: If it is already installed then follow the below steps to set $PATH variable for permanently:

Steps:

1.Copy the installation path of adb it may be like (/Users/user-name/Library/Android/sdk/platform-tools/adb).

2.First, check if .zshrc exist or not if not create this file using the given command, Open your terminal and write 
```
sudo touch ~/.zshrc
```

3.Now to open .zshrc file, write the command nano ~/.zshrc
Set the below path

```
export ANDROID_HOME=/Users/user-name/Library/Android/sdk
export PATH=$ANDROID_HOME/platform-tools:$PATH
export PATH=$ANDROID_HOME/tools:$PATH
export PATH=$ANDROID_HOME/tools/bin:$PATH
```

4.To save it hit Ctrl+X, type Y to save, and then press Enter to keep the file name the same as it is

5.Restart the terminal and check with echo $PATH it will show adb path.

6.check all running adb devices by adb devices

Notes: You will not need to open /.bash_profile every time if you follow the above method.

So if you like this post hit the clap button.
And thanks for giving your useful time to read this post.
(Youtube Video: https://youtu.be/77Be98W8LVA)
Getting started with Firebase web v9 API
Tags: firebase, webdev, javascript
Published: 2021-07-24 10:53:29

As I wrote in my previous article, I have started exploring  [Firebase ](https://firebase.google.com/) web v9 APIs. I am going to explain how easy to get started with Firebase web v9 API ( [beta](https://www.npmjs.com/package/firebase/v/9.0.0-beta.7) ) and setup your project. This article covers the following to kick start your next experiment with Firebase APIs.

-  [Create a project scaffold](#create-a-project-scaffold) 
-  [Create Firebase project](#create-firebase-project) 
-  [Setting up Firebase tools](#setting-up-firebase-tools) 
-  [Firebase web v9 API configuration](#firebase-web-v9-api-configuration) 
-  [Application configuration](#application-configuration) 
### Create a project scaffold
I used  [Vite ](https://vitejs.dev/) scaffolding tool to create my project skeleton. Just fill the questions and you will be able to get one for you. In my case, I created a project with Vue.js framework. 

```
npm init @vitejs/app <project_name>
``` 
```
cd <project_name>
npm install
npm run dev
``` 
By now, you should be able to see the sample project up and running on port 3000
### Create Firebase project
Now you need to create a Firebase project. For that you need to go 'https://console.firebase.google.com/' and create your project. This requires a Google account if not create one for you :)
Just follow the instruction once you reach the firebase console and fill the required details about the project name and other details.
### Setting up Firebase tools
Now we are going to install the required firebase tools to manage the project from our system. Execute the following commands from your project directory which was created in the first step

```
npm install -g firebase-tools
firebase login //to access your firebase project created from the previous step
``` 
### Firebase web v9 API configuration
```
npm install --save firebase@9.0.0-beta.7 //Latest beta when I write this
``` 
### Application configuration
Now you are ready to use the Firebase web v9 API in your application. Create a Javascript file under src directory to hold your Firebase project configurations.

```javascript
import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';

var firebaseConfig = {
  apiKey: "<apiKey>",
  authDomain: "",
  databaseURL: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: ""
};

const firebaseApp = initializeApp(firebaseConfig);
const auth = getAuth(firebaseApp);

export { auth };
``` 
**NOTE:** Replace the above details with your project specific configuration. You grab the details from your Firebase console.
Everything is now completed and you can import the auth variable in your project and use it.
Best Tutorials On VSCODE Editor
Tags: vscode, ides, webdev, php
Published: 2021-07-24 10:31:48

Recently VS code has become so much popular among developers. It has lots of useful plugins, It has very good theme and interface like dark mode etc.

IDE is very important things for any developer / programmers.

Here I am listing some the best tutorials which are available on google for VS code IDE.


1. [BEST VS CODE THEMES 2021](https://cmsinstallation.blogspot.com/2021/07/7-best-vs-code-themes-2021-you-should.html)

2. [GIT Connect](https://www.digitalocean.com/community/tutorials/how-to-use-git-integration-in-visual-studio-code)

3. [USEFUL VSCODE EXTENSIONS](https://cmsinstallation.blogspot.com/2021/03/13-vscode-extensions-that-every-web.html)

4. [VSCODE THEMES](https://morioh.com/p/fc50cc45927f)

5. [CREATING VSCODE THEME](https://css-tricks.com/creating-a-vs-code-theme)
TypeScript easier to use into existing JS projects
Tags: javascript, typescript
Published: 2021-07-24 10:23:40

TypeScript is among the rare language projects of history that have seen significant adoption from developers, an incredible feat to be sure. However, TypeScript adoption will always pale in comparison to JavaScript adoption in general. In that sense, I believe it is crucial that TypeScript plays naturally with other JavaScript that is not typed and is not written in TypeScript. After all, TypeScript is a superset of JavaScript, right?
That brings me to what we’ve seen over the last year of Ionic 2 development with TypeScript. Right now, the number one challenge Ionic developers face when using TypeScript in Ionic 2 is importing JavaScript modules from npm that are not typed and do not have typings available. Over and over, we see developers attempt to follow code they find on the web where an ES6+ library is imported, but then struggle to understand why TypeScript then throws errors that the module cannot be found.
The workaround for this in TS 2.0 is to add a stub module declaration, something like

```
declare module “module-from-npm”;
```

And place this in a d.ts file. As such, we’re seeing developers that have TypeScript savvy add a bunch of these stub definitions that have no type information, just to get TypeScript to not throw errors on compilation for modules that don’t and might never have type information available.
The argument for requiring types for modules is that TypeScript can’t tell what the “shape” of the module is without types. However, it shouldn’t need to know the shape because the module doesn’t have nor does it need types. Yes, this means my IDE/intellisense experience will suffer, but that’s okay. If I want to add typings for the module later, and perhaps contribute them to the @types registry, why not let me do that once I’m ready to enhance my experience through typings?
In the past, I’ve gone so far as to fork existing libraries on github just to add typing stubs so that users won’t have to add them in their own apps.

I believe this would help TypeScript proliferate and lower the barrier to entry for newcomers to modern JavaScript and to typed JavaScript. I know Ionic developers would sure be happy about this!