teleren/devto huggingface dataset:
HTML tags | head
Tags: html, tags, head
Published: 2021-11-26 07:20:58

**It contains machine-readable information (metadata) about the document**. It must be the first element of an `<html>` element.

Metadata is not displayed and it typically defines the document title, character set, styles, scripts, and other meta information.

The following elements can go inside the `<head>` element:

* `<title>` (required in every HTML document)
* `<style>`
* `<base>`
* `<link>`
* `<meta>`
* `<script>`
* `<noscript>`
	
The start tag may be omitted if the first thing inside the `<head>` element is an element. The end tag may be omitted if the first thing following the `<head>` element is not a space character or a comment.

HTML5-compliant browsers automatically create a `<head>` element if its tags are omitted in the markup. [This auto-creation is not guaranteed in ancient browsers](https://www.stevesouders.com/blog/2010/05/12/autohead-my-first-browserscope-user-test/).

- Type: *-*
- Self-closing: *No*
- Semantic value: *No*

[Definition and example](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head) | [Support](https://caniuse.com/mdn-html_elements_head)
Display content with the 'only' class  in Tailwind CSS
Tags: tailwindcss, css, rails, tutorial
Published: 2021-11-26 07:15:58

With Tailwind's JIT release, developers can act up HTML elements that are in a specific state. The [only](https://tailwindcss.com/docs/just-in-time-mode#exhaustive-pseudo-class-support) class is practical addition to display a HTML element if it has no sibling HTML elements. Under the tailwind-hood, the only class translates into the [only-child](https://developer.mozilla.org/en-US/docs/Web/CSS/:only-child) selector.

---

- [empy state](#empty-state)
- [only:block](#onlyblock)
- [refactored](#refactored)

---

## Empty state

Imagine you want to display content only if it is stored in the database. The initial step is to create a conditional statement to render parts of the HTML based on the condition you provide. In the rails example below, the conditional check is `@tasks.empty?`. If the `@tasks` collection is empty, the empty state message is displayed.

```erb
<ul>
  <% if @tasks.empty? %>
    <% @tasks.each do |task| %>
      <%= render "task/task", task: task %>
    <% end %>

  <% else %>
    <p class="block">All tasks completed.</p>
  <% end %>
</ul>
```

## only:block

Now, although the code above definitely works, you have added a(nother) conditional to your code.

An alternative is to handle this natively with CSS.

```erb
<ul>
  <% @tasks.each do |task| %>
      <%= render "task/task", task: task %>
  <% end %>

  <p class="hidden only:block">All tasks completed.</p>
</ul>
```

The empty state's element (p-tag) has a default state of hidden. The added __only__ class change the display status to __block__ when the element has no siblings.

## Refactored

Or leverage the rails [collection renderer](https://guides.rubyonrails.org/layouts_and_rendering.html#rendering-collections) to re-factor your code into:
```erb
<ul>
  <%= render @tasks %>

  <p class="hidden only:block">All tasks completed.</p>
</ul>
```
Advanced Typescript | Generics
Tags: javascript, typescript, programming, technology
Published: 2021-11-26 07:01:51

![Large elephant with Typescript logo and small elephant with JavaScript logo](https://miro.medium.com/max/2000/1*jUBpz0DE_5DSUvDOk_3ZJg.png)

Learn advanced Typescript features and apply them to practical code exercises

Typescript Generics provide a way to write flexible code that can work with various data types rather than a single data type. That allows users of the code to provide their own types.



{% medium https://medium.com/@mariusbongarts11/advanced-typescript-generics-1b30d6b5dd49 %}
Use react-hot-toast with Promise & Axios
Published: 2021-11-26 06:55:44

## Promise 
A [promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) is an object that may produce a single value some time in the future : either a resolved value, or a reason that it's not resolved (e.g., a network error occurred). A promise may be in one of 3 possible states: fulfilled, rejected, or pending

:point_right: A promise can states

:white_check_mark: fulfilled - The action relating to the promise succeeded
:x: rejected - The action relating to the promise failed
:white_circle: pending - Hasn't fulfilled or rejected yet

## Axios
[Axios](https://axios-http.com/) is a Javascript library used to make HTTP requests from node. js or XMLHttpRequests from the browser and it supports the Promise API that is native to JS ES6. It can be used intercept HTTP requests and responses and enables client-side protection against XSRF. It also has the ability to cancel requests

## react-hot-toast
[Smoking hot Notifications for React](https://github.com/timolins/react-hot-toast).
Lightweight, customizable and beautiful by default.

React Code
```
import toast, { Toaster } from "react-hot-toast";
import { useEffect } from "react";
import axios from 'axios'
export default function App() {
  const fetchData = async () => {
    const response = await axios.get(
      "https://jsonplaceholder.typicode.com/users"
    );
    console.log({ response });
    return response;
  };

  useEffect(() => {
   const callFunction= fetchData();
   toast.promise(callFunction, {
    loading: "Process",
    error: "error occurs in data",
    success: "get data successfully...."
  });
  }, []);

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <Toaster />
    </div>
  );
}

```


 :clap: Thanks for reading
Meson Network helps WordPress developers better access to the Web3.0
Tags: web3, wordpress, github, blockchain
Published: 2021-11-26 06:36:17

 [Meson Network](https://meson.network/)  is a Web3.0 bandwidth trading market that uses the blockchain protocol model to integrate idle bandwidth resources and provides the cornerstone of data transmission for Web3.0 infrastructure such as Arweave and IPFS.
 
As the most popular blog system in the Web2.0 era, WordPress has a huge developer user base, and there are also many enthusiasticses of Web3.0 applications like Arweave and IPFS. Therefore, the WordPress plugin DCDN Engine released by Meson Network helps developers on WordPress quickly experience the DCDN accelerated network from Web3.0.


![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8jfxqtvz1s65eyfl9th4.png)
 
Link:  [https://wordpress.org/plugins/dcdn-engine/](https://wordpress.org/plugins/dcdn-engine/) 


## Tutorial
 
### Install DCDN Engine


![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/diri45uns6u0962e59ty.png)
![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7fqlci67gs4jl2rs94dn.png)
  


### Configure DCDN Engine

![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eaz7vo7ymswlvkf81zjy.png)
 
![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4iufs0ozkr99ztoighu7.png)
 




```
DCDN URL: https://coldcdn.com/api/cdn/xxxxxx

Included Directories: wp-content,wp-includes

Exclusions: .php
``` 

### Test Meson Network


![Meson Network](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/30jhbjwuf7j37sxlaj21.png)
 

## Receive trial fee
 
Developers can get $118+ worth of Meson Network usage fee by completing the following 6 tasks and submitting the link.
 
1. Register on Meson Network and get 5 USD
 
2. Write a blog about Meson Network and get 20-100 USD
 
3. Add a hyperlink to Meson Network at the bottom of the website to get 30  USD


```
DCDN by <a rel="license" href="https://meson.network/"> Meson Network </a>
``` 


4. Follow @NetworkMeson on Twitter to get 10 USD
 
5. Share Meson Network on Twitter and get 5 USD
 
6. Submit a proposal to DCDN Engine through Issues and get 8 USD

Submit Google Form:  [https://forms.gle/MdY42BSHPNQvTW2n7](https://forms.gle/MdY42BSHPNQvTW2n7)
JAVASCRIPT 
Tags: javascript, java, coding
Published: 2021-11-26 06:28:37

Java is a high-level, class-based, object-oriented programming language that is designed to have as few implementation dependencies as possible. It is a general-purpose programming language intended to let programmers write once, run anywhere (WORA), meaning that compiled Java code can run on all platforms that support Java without the need for recompilation. Java applications are typically compiled to bytecode that can run on any Java virtual machine (JVM) regardless of the underlying computer architecture. The syntax of Java is similar to C and C++, but has fewer low-level facilities than either of them. The Java runtime provides dynamic capabilities (such as reflection and runtime code modification) that are typically not available in traditional compiled languages. As of 2019, Java was one of the most popular programming languages in use according to GitHub, particularly for client–server web applications, with a reported 9 million developers.

Java was originally developed by James Gosling at Sun Microsystems (which has since been acquired by Oracle) and released in 1995 as a core component of Sun Microsystems' Java platform. The original and reference implementation Java compilers, virtual machines, and class libraries were originally released by Sun under proprietary licenses. As of May 2007, in compliance with the specifications of the Java Community Process, Sun had relicensed most of its Java technologies under the GPL-2.0-only license. Oracle offers its own HotSpot Java Virtual Machine, however the official reference implementation is the OpenJDK JVM which is free open-source software and used by most developers and is the default JVM for almost all Linux distributions.
Christmas 2021 Offers - Hire Any Dedicated Developers 
Published: 2021-11-26 06:23:03

- Offer for new clients only
- Offer is  subject to availability of developers
- Free Hours starts after completion of contracted period.
- Offer will not be considered if project is discontinued before completion due to any reason. 
- Hiring contract must be accepted on or before 31st of December 2021. 
- 40 hours and 160 hours is considered for 1 week and 1 month respectively. 
- Offer valid till 31st December 2021, time: 11:59 PM

Visit - https://www.manektech.com
Simple way to generate random string in PHP
Tags: php, security, webdev, programming
Published: 2021-11-26 06:18:40

While developing an application, sometimes it requires generating a random but unique string, e.g. **Password Generator, CSRF token**, and many more.

There are so many methods to generate random and unique strings in PHP. For Example:
```
rand();
uniqid();
bin2hex(random_bytes(20));
```
![Simple way to generate random string in PHP](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/shyuzpal9et2ewpjfbx7.jpg)
But I prefer my way to generate a random string by using existing PHP functions and bit improvisation.
Here is the function:
```
function random_seed(){
  list($usec, $sec) = explode(' ', microtime());
  return $sec + $usec * 1000000;
}

function getRadomSeed(){
    mt_srand(random_seed());
    $prefix = substr(str_shuffle(str_repeat($x='abcNOPQRSTUVWXYZdefghijklmnopqrstuvwxyzABCDEFGHIJKLM', ceil(5/strlen($x)) )),1,5);
    $suffix = substr(str_shuffle(str_repeat($x='wxyzABCDEFGHIJKLMNOabcdefghijklmnopqrstuvPQRSTUVWXYZ', ceil(5/strlen($x)) )),1,5);
    $randval = mt_rand();
    if(strlen($randval) % 2 == 0){
        $random = $prefix.$randval.$suffix;
    }else if(strlen($randval) % 3 == 0){
        $random = $prefix.$suffix.$randval;
    }
    else{
        $random = $randval.$prefix.$suffix;
    }
    return $random;
}
```
Execute:
```
$rd = getRadomSeed();
echo $rd;
```
Just to be sure that this is not the only way to generate random strings in PHP. I am just sharing one of my ways to generate random strings.
Happy Thanksgiving! 🦃
Introduction to Laika: A Request Builder for Web 3.0
Tags: blockchain, showdev, productivity, tooling
Published: 2021-11-26 05:15:05

## Laika? 🐶
Laika is a Blockchain development tool that helps you request to smart contract without having the hassle to write a single line of code.

Laika aims to provide developers with easy to use interface when working with smart contracts, auto-generated code, documentation tools, and enhance team collaboration.

To put simply what Laika aims to be is what Postman was for Web 2.0 for the Web 3.0

![Laika's Interface](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w3pakhnjs3ps7ove3rpp.png)

## Feature 🔥
* Send requests to test and verify your smart contracts on any * EVM-based chains even your local chain (More coming soon..)
* Connect easily with the Web3.0 wallet of your choice.
* View response with raw and formatted styles.
* History of past requests is supported.
* Support ABIs imports.
* Auto-generate ABIs base on parameters, expected returns.
* Collections for easier managing your contracts.
* (More coming soon🔥)


> Connect with us
> Twitter: https://twitter.com/getlaikaapp
> Facebook: https://www.facebook.com/getlaikaapp/
How to Filter and Group the Blazor Dropdown List Items
Tags: blazor, webdev, dotnet, csharp
Published: 2021-11-26 04:51:33

In this video, you will learn how to group the [Blazor Dropdown List](https://www.syncfusion.com/blazor-components/blazor-dropdown-list?utm_source=social&utm_medium=socialmedia&utm_campaign=backlink_promotion) items as well as how to filter them. You will also see different filter types in the Dropdown List and how to apply those filters. 

Product Overview : [Blazor Dropdown List](https://www.syncfusion.com/blazor-components/blazor-dropdown-list?utm_source=social&utm_medium=socialmedia&utm_campaign=backlink_promotion) 

Explore our tutorial videos: https://www.syncfusion.com/tutorial-v... 

Download this example from GitHub: https://github.com/SyncfusionExamples... 

{% youtube 9Ouje7KEOEU %}
Accessing portions of a string
Published: 2021-11-26 04:46:05

The individual characters of a string can be extracted from a string by using the indexing methods of a string. There are two R’s inbuilt functions in order to access both the single character as well as the substrings of the string.

substr() or substring() function in R extracts substrings out of a string beginning with the start index and ending with the end index. It also replaces the specified substring with a new set of characters.

Syntax:
substr(..., start, end)
or 
substring(..., start, end)

Example 1: Using substr() function
# R program to access
# characters in a string
  # Accessing characters 
# using substr() function
substr("Learn Code Tech", 1, 1)
Output:
"L"
If the starting index is equal to the ending index, the corresponding character of the string is accessed. In this case, the first character, ‘L’ is printed.
Import Database ลงเครื่อง DEV อย่างไร? เมื่อต้องเจอกับข้อมูลขนาดใหญ่!! (~3G)
Tags: database, mysql
Published: 2021-11-26 04:35:22

ใช้ [Sequel Pro](https://www.sequelpro.com/) ในการ Import เพราะเนื่อจากเป็นข้อมูลขนาดใหญ่ (~ 3GB) การ import จะใช้เวลานานจีงไม่เหมาะกับการใช้ PHPMyAdmin ที่มีการ Limit timeout

ให้ Import  Structure ก่อนแล้วตามด้วย Data เพราะป้องกันความเสียระหว่างการ Import Data

### ขั้นตอน
1. ติดตั้ง **Sequel Pro**
2. Export Structure และ Data แยกกันเป็น 2 file
3. Import Structure 
4. Import Data ผ่าน **Sequel Pro**
Github Actions for React-Native App
Tags: actionshackathon21, reactnative, react, javascript
Published: 2021-11-26 04:30:38

### My Workflow
Building cross platform application with react native consumes time for android and iOS, both. Github actions allows to reduce it by writing or using existing workflows even for web. I have implemented for my react-native app to build android app. (find link below).


### Submission Category: Phone Friendly


### Yaml File or Link to Code
 {% github https://github.com/TheRakeshPurohit/VaccinfoApp %}
R - Strings
Published: 2021-11-26 04:20:59

Strings are basically a bunch of character variables. It is a one-dimensional array of characters. One or more characters enclosed in a pair of matching single or double quotes can be considered as a string in R. Strings represent textual content and can contain numbers, spaces and special characters. An empty string is represented by using “”. Strings are always stored as double-quoted values in R. Double quoted string can contain single quotes within it. Single quoted strings can’t contain single quotes. Similarly, double quotes can’t be surrounded by double-quotes.

Creation of String
Strings can be created by assigning character values to a variable. These strings can be further concatenated by using various functions and methods to form a big string.
Example:
# R program for String Creation
 # creating a string with double quotes
str1 <- "OK1"
cat ("String 1 is : ", str1)
  
# creating a string with single quotes
str2 <- 'OK2'
cat ("String 2 is : ", str2)
str3 <- "This is 'acceptable and 'allowed' in R"
cat ("String 3 is : ", str3)
str4 <- 'Hi, Wondering "if this "works"'
cat ("String 4 is : ", str4)
str5 <- 'hi, ' this is not allowed'
cat ("String 5 is : ", str5)
Output:
String 1 is :  OK1
String 2 is :  OK2
String 3 is :  This is 'acceptable and 'allowed' in R
String 4 is :  Hi, Wondering "if this "works"
Error: unexpected symbol in "        str5 <- 'hi, ' this"
Execution halted
Assignment Helper Online
Tags: assignmenthelps, assignmenthelpersonline, assignmenthelpcanada
Published: 2021-11-26 04:07:28

<a href="https://greatassignmenthelper.com/ca/"> Assignment Helper Online </a> from GreatAssignmentHelper.com offers you flawless assignment compositions that assure best grades at very moderate and affordable rates. Our <a href="https://greatassignmenthelper.com/ca/"> Assignment Help Canada </a> has been consistently offering precise and excellent Assignment Help within assigned timelines to a great many understudies across Canada. Prompt support of our Assignments Writing Services is available round the clock.
Day 20 of #100daysofcode: Happy Thanksgiving!
Tags: 100daysofcode, react, python, beginners
Published: 2021-11-26 02:29:43

Happy Thanksgiving everyone!

As you might imagine, I spent most of the day with family and did not have much time to spend working. I hope you all had a great holiday!

## Today
* Worked on some Leetcode problems
  * Did not complete any. I worked on a couple Hard problems and did not want to resort to checking the solutions of them yet. Notably, I worked on the [rain catching problem](https://leetcode.com/problems/trapping-rain-water/) and the [maximum profit in job scheduling](https://leetcode.com/problems/maximum-profit-in-job-scheduling/). I was working on and thinking about them in between chores, so my heart wasn't completely in it. I will come back to them tomorrow and try to solve them, or I will learn about a couple of the solutions.
* Worked through some more of the FreeCodeCamp Regex tutorials, nearing the end
* No work on any projects, bit of a day off!

## Upcoming
* **Finals and final project sprints**: Not much time left!
* Iron out details regarding the Study Aid app (I really need to name this thing) -- May work on this this weekend
  * Flask vs Django
  * Should I change how I deploy? Should Docker get in the picture?
  * Are there any other systems I should think about using as a part of this project?
* Learn more about Material UI, I will probably use Material UI a little bit in my (ongoing) school project. 
* Start the Study Aid app!
* Later in the challenge: AWS Deployment, AWS Certification, and Using Docker!?


Have a great, long weekend everybody, stay safe!

### Resources
[JS Course - FreeCodeCamp](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/)
[Material UI](https://mui.com)
[Regex Tutorial - FreeCodeCamp](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures#regular-expressions)
Best fake Christmas tree for your money, Homechit reviews
Published: 2021-11-26 02:02:27

It's that time of year again when you're left with a tree that's barely alive but still filled with all the sparkly lights, festive music, and tasty treats your guests will love.� Why is it so hard to find the perfect tree? And what about those out-of-control costs? With all the time it takes to shop for one these days, you could spend the day at home instead!� With Homechit, there's no need for you to spend hours online searching for just the right tree. We curate our selection of artificial Christmas trees with care and attention to detail so you'll be able to create your perfect holiday experience without spending hours.�

Watch our full reviews at: https://bit.ly/3cC4Wa2

� Related posts:

✔️ https://bit.ly/3cC4Wa2

✔️ https://bit.ly/3HOppqo

✔️ https://bit.ly/32gdbGQ

✔️ https://bit.ly/3xcjruP

✔️ https://bit.ly/30St1Hb



➡️ Our website: https://homechit.com/

➡️ Youtube: https://bit.ly/3xbodst

Read more:
https://homechit.com/best-pre-lit-christmas-tree/
https://homechit.com/best-christmas-tree-deals/
https://homechit.com/best-artificial-trees/
https://homechit.com/best-place-to-buy-artificial-christmas-tree/
https://homechit.com/best-fake-trees/
https://homechit.com/best-faux-christmas-trees/
https://homechit.com/best-price-on-christmas-tree/
https://homechit.com/best-deals-on-artificial-christmas-trees/
https://homechit.com/best-pre-lit-artificial-christmas-trees/
https://homechit.com/best-christmas-tree-sale/

Tags: #artificialchristmastree #christmastrees #artificialtrees #christmastree best christmas trees 2021, Best Christmas Tree of December
npx create-react-app myapp error "\AppData\Roaming\npm-cache\_npx\19748" does not contain a package.json file in appdata folder
Published: 2021-11-26 01:28:03

this error occurs usually when name of the PC contain a space like
`mycomputer name`

you should fix this by redefine your npm cache root There is a simple workaround to fix this problem. 8.3 DOS path format should be used. Open command prompt in administration mode then cd to C:\Users and run this command :
`C:\Users>dir /x`

and find the short path for your desired directory i.e. username let us say it is MYCOMP~1 (it's not always MYCOMP~1 ) try:
`npm config set cache "C:\Users\MYCOMP~1\AppData\Roaming\npm-cache" --global`

be careful for space character in the pc name you should use the one you got from command prompt instead and now use:
`npx create-react-app myapp`
November 25th, 2021: What did you learn this week?
Tags: weeklylearn, discuss, weeklyretro
Published: 2021-11-26 01:03:11

It's that time of the week again. So wonderful devs, what did you learn this week? It could be programming tips, career advice etc.

<center>

![Yoda wooping someone's butt](https://media.giphy.com/media/yDYAHbqe5DfyM/giphy.gif)
</center>

Feel free to comment with what you learnt and/or reference your TIL post to give it some more exposure.

{%tag todayilearned %}

And remember, if something you learnt was a big win for you, then you know where to drop it as well.👇👇🏻👇🏼👇🏽👇🏾👇🏿

{%link https://dev.to/devteam/what-was-your-win-this-week-30gf %}

<center>

![Little kid making a fist as if to say "Yes!"](https://media.giphy.com/media/6brH8dM3zeMyA/giphy.gif)
</center>