teleren/devto huggingface dataset:
Building Real-Time Web Applications with Blazor SignalR
Tags: programming, dotnet, dotnetcore, webdev
Published: 2023-04-28 05:06:47

Blazor is a modern and powerful framework for building web applications using C# and .NET. With the release of Blazor Server and Blazor WebAssembly, developers now have two options for building web applications with Blazor. However, real-time web applications that require immediate updates and interactions between clients and servers can be a challenge. This is where SignalR comes into play.

SignalR is a real-time communication library that allows developers to add real-time web functionality to their applications. In this post, we will explore how to integrate SignalR into a Blazor application to create real-time web applications.

First, let's create a new Blazor Server application using Visual Studio or the .NET CLI. Then, add the SignalR package to the project using the NuGet package manager.

Next, create a new SignalR hub by adding a new class to the project that derives from the Microsoft.AspNetCore.SignalR.Hub class. This hub will handle incoming client connections and messages.

```
public class ChatHub : Hub
{
    public async Task SendMessage(string user, string message)
    {
        await Clients.All.SendAsync("ReceiveMessage", user, message);
    }
}
```

The SendMessage method will be called from the client and will broadcast the message to all connected clients using the ReceiveMessage method.

In the Blazor component, add the SignalR JavaScript library to the project by adding the following script tag to the index.html file:

```
<script src="_content/Microsoft.AspNetCore.SignalR.Client/js/signalr.js"></script>
```
Then, inject the SignalR hub into the component and establish a connection to the server:

```
@inject Microsoft.AspNetCore.SignalR.HubConnection hubConnection

@code {
    protected override async Task OnInitializedAsync()
    {
        await hubConnection.StartAsync();
    }
}
```
Finally, add a form to the component that allows the user to enter a username and message. When the form is submitted, call the SendMessage method on the SignalR hub:

```
<form>
    <input type="text" @bind-value="username" />
    <input type="text" @bind-value="message" />
    <button @onclick="SendMessage">Send</button>
</form>

@code {
    private string username;
    private string message;

    private async Task SendMessage()
    {
        await hubConnection.SendAsync("SendMessage", username, message);
    }
}
```
Now, when a user submits a message, it will be broadcast to all connected clients in real-time. This is just a simple example of how to use SignalR in a Blazor application, but the possibilities are endless.

SignalR is a powerful tool that can be used to create real-time web applications with Blazor. By integrating SignalR into a Blazor application, developers can create responsive and interactive web applications that provide a seamless user experience.
AI Generated News Podcasts
Tags: ai, podcast, chatgpt, python
Published: 2023-04-28 04:52:07

NewsBytes is a new project that recently launched which publishes ~5 minute podcasts, available on all major streaming platforms. News summarisation and podcast script generation are powered by ChatGPT - with other modules aiding for the remaining podcasting pipeline.

With many avenues to grow, NewsBytes has the potential to expand with contributions and cater to a wider audience in the future!

Github link: https://github.com/Zafirmk/NewsBytes
Three JS Examples : 9. Three Js Ghost Card Animation
Tags: threejs, css, design, webdev
Published: 2023-04-28 04:08:27

Three.js is a cross-browser JavaScript library and application programming interface used to create and display animated 3D computer graphics in a web browser using WebGL.  

[Three js docs](https://threejs.org/docs/)

---
 

## Three Js Ghost Card Animation
---

{% youtube pOGaBXfd_GQ %}


 ---
### [Source code](https://democoding.in/threejs/three-js-ghost-card-animation)

---

{% gist https://gist.github.com/amitSharma7741/febf0d9ce1fbb143c3f6b290eb031182 %}
 
---
---

---

### Best Post 

1. [How to create a Scroll to top button in React](https://democoding.in/post/how-to-create-a-scroll-to-top-button-in-react)

2. [CSS 3D Isometric Social Media Menu Hover Effects](https://democoding.in/post/css-3d-isometric-social-media-menu-hover-effects)

![CSS 3D Isometric Social Media Menu Hover Effects](https://camo.githubusercontent.com/ae671092ea8cd031abde235fae68d7a8111ec4868515fdbbea5f55f696c2e269/68747470733a2f2f692e6962622e636f2f636b314d636a6d2f657a6769662d636f6d2d63726f702e676966)

3. [Input Box Shake on Invalid Input](https://democoding.in/post/shake-on-invalid-input)

4. [Beautiful SVG Cat Animation in React](https://democoding.in/post/beautiful-svg-cat-animation-in-react)

---
---

## For more information

 

1. Subscribe my Youtube Channel 
[https://www.youtube.com/@democode](https://www.youtube.com/@democode) 

2. Check out my Fiver profile if you need any freelancing work
[https://www.fiverr.com/amit_sharma77](https://www.fiverr.com/amit_sharma77)

3. Follow me on Instagram
[https://www.instagram.com/fromgoodthings/](https://www.instagram.com/fromgoodthings/)

4. Check out my Facebook Page 
[Programming memes by Coder](https://www.facebook.com/programmingmemesbycoders)

5. Linktree
[https://linktr.ee/jonSnow77](https://linktr.ee/jonSnow77)

 

---
---

{% instagram CqObFa6PR0l %}

---

{% link https://dev.to/jon_snow789/cmd-commands-that-show-you-are-hacker-4ig1 %}

---
 
---

### Follow us on Google News

[https://news.google.com/publications/CAAqBwgKMLiXzAsw6LLjAw/](https://news.google.com/publications/CAAqBwgKMLiXzAsw6LLjAw/)
bet1korea
Published: 2023-04-28 04:05:20

[해외정식사이트](https://www.bet1korea.com/) 카지노사이트 Uni88Bet은 축구, 농구, 야구, 배구 등 1000여개의 스포츠 배팅 및 라이브 온라인 카지노를 제공합니다. Uni88Bet에는 여러가지 베팅 종류가 있으며, 매달 다양한 경기를 제공합니다.
How to Integrate ZOHO CRM with Magento 2
Tags: webdev, magento, magento2tutorials
Published: 2023-04-28 03:55:24

Each fruitful business undertaking realizes that the client is at the focal point of all that they do. Giving the best client experience is vital to expanding benefits. That is the reason incorporating Zoho CRM with Magento 2 can be a unique advantage. This strong blend gives an effective answer for overseeing client information and deals processes.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4og9oorsvgh28oyrlkep.png)

By incorporating these two stages, you can smooth out the deals cycle, further develop correspondence with your clients, and lift general productivity. This blog is here to assist you with exploring the coordination interaction bit by bit so you can undoubtedly figure out **_how to Integrate ZOHO CRM with Magento 2 _**and take your business to a higher level.

For more info, visit **_https://webguru.dev/how-to-integrate-zoho-crm-with-magento-2/_**
ĐĂNG KÍ KHÓA HỌC DIGITAL MARKETING TẠI IMTA BẠN SẼ HỌC GÌ?
Published: 2023-04-28 03:50:19

Khóa học Digital Marketing tại IMTA cung cấp kiến thức Marketing Online, phương pháp viết nội dung chuẩn SEO, thực hàng quảng cáo FB Ads, Google Ads từ cơ bản đến chuyên sâu, thiết kế đồ họa, Video Marketing, thiết kế website bằng WordPress và lập kế hoạch Digital Marketing, Affiliate Marketing, Zalo Marketing.

Giảng viên nhiều năm kinh nghiệm trong lĩnh vực Digital Marketing

Hỗ trợ học viên suốt quá trình học và sau khóa học.

Để hiểu rõ hơn về khóa học liên hệ ngay để được tư vấn miễn phí tại trang web:  [](https://imta.edu.vn/khoa-hoc-digital-marketing-online/)
#khoahocdigitalmarketing #khoahocmarketing #khoahocdigitalmarketingimta #khoahocdigitalmktimta
Địa chỉ: Tầng 4, Tòa Nhà Charmington La Pointe, Số 181 Cao Bằng Bằng Thắng nối dài, Phường 12, Quận 10, Hồ Chí Minh
Hotline: 0896677499
Xem thêm:  [](https://myspace.com/khoahocdigitalmarketing)
Do browsers really understand JSX? What are transpilers?
Tags: javascript, webdev, programming, computerscience
Published: 2023-04-28 03:48:30

Do browsers understand JSX?

Short Ans - NO

Long Ans - No, to render JSX in a web browser, it needs to be transpiled into regular JavaScript using a tool like Babel. The resulting JavaScript code can then be executed by the web browser.

So, What it is meant to be transpiled?
=> Transpiling is the process of converting source code written in one programming language into another programming language that has a similar level of abstraction.

But that's what a compiler do, so what's the difference?
=> Transpilers and compilers are both types of tools that convert code written in one programming language into another language, but there are some differences between them:
1)Output language: The main difference between a transpiler and a compiler is the output language. A compiler typically translates source code into machine code that can be directly executed by a computer, while a transpiler usually converts code into a higher-level programming language that needs to be further processed or executed in a runtime environment.

2)Level of abstraction: Compilers generally operate at a lower level of abstraction than transpilers.
(The level of abstraction refers to how much detail or complexity is present in a particular idea or concept.)
For example, let's consider the concept of a car. At a high level of abstraction, we might think of it as a vehicle that transports people or goods from one place to another. We're not concerned with the specific details of the car's mechanics, design, or history.
On the other hand, at a low level of abstraction, we might look at specific details of a car, such as its engine, transmission, wheels, and interior features. We're now dealing with more specific and detailed information.

3)Target audience: Compilers are usually intended for developers who are building low-level systems or performance-critical applications, while transpilers are more commonly used by web developers who want to write code in modern languages and still support older web browsers.
6 steps to Efficient DevOps Implementation
Tags: devops, devjournal, implementation, beginners
Published: 2023-04-28 01:36:00

Implementing DevOps effectively requires a focus on collaboration, automation and continuous improvement.

6 steps to Efficient DevOps Implementation are:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5tv42lbtsfjsy4874s10.png)


Thanks for reading this.

If you have an idea and want to build your product around it, schedule a call with [me](https://calendly.com/pragyanatvade).

If you want to learn more about DevOps and Backend space, [follow me](https://dev.to/pragyanatvade).

If you want to connect, reach out to me on [Twitter](https://twitter.com/pragyanatvade) and [LinkedIn](https://www.linkedin.com/in/pragyanatvade/).
SPVM::Digest::MD5 - MD5
Tags: perl, spvm
Published: 2023-04-28 03:28:36

The Digest::MD5 class of <a href="https://metacpan.org/pod/SPVM">SPVM</a> has methods for MD5.

## Document

<a href="https://metacpan.org/pod/SPVM::Digest::MD5">SPVM::Digest::MD5 - CPAN</a>

## Repository

<a href="https://github.com/yuki-kimoto/SPVM-Digest-MD5">SPVM::Digest::MD5 - Github</a>
deferred deep linking configure in ios
Tags: reactnative
Published: 2023-04-28 03:26:26

I have configured deferred deep linking using Firebase dynamic URL. when I click the open button on the dynamic link preview page. it opens the app store and I can install the app. When I click the open button on the app store page app does not correctly open the page of the app. but when I click again open button is on the preview page. it correctly opens the page of the app. Could anyone have any idea about it? mobile app is react native applicaion
SQL 新增完成後取得 PK
Published: 2023-04-28 03:22:17


一開始學習 SQL 語法時不外乎是 CRUD，由於需求的關係，要將新增後產生的 PK 傳回到後端，或者是將 PK 拿去處理別的事，如果經驗值不夠或者還沒深入進階實務，會直覺地使用 `SELECT` 加上 `ORDER BY` 或者是 `MAX` 去找最後一筆資料：

```SQL
-- 新增一筆資料
INSERT INTO Member (Name) VALUES('TEST')

-- 使用 MAX 找最大 PK
SELECT MAX(PK) FROM Member

-- 使用 ORDER BY 找出最後一筆資料
SELECT TOP 1 PK FROM Member ORDER BY PK DESC
```

我們應該直接使用內建函數—`@@IDENTITY` 來**傳回最後插入的識別值**，該方法只能傳回識別種子。

```SQL
INSERT INTO Member (Name) VALUES ('TEST')

-- 使用內建函數 @@IDENTITY
SELECT @@IDENTITY PK
```

還有一種方法可以查看最後插入的識別種子，還可以任意查看指定欄位最後插入的值。

```SQL
INSERT INTO Member (NAME)
-- 使用 OUTPUT 和 INSERTED 傳回指定的欄位
OUTPUT INSERTED.ID, INSERTED.Name
VALUES ('TEST')
```

**筆記**
- 第一種方法在時間差的情況下，會有小機率取得下一個使用者新增的 PK，故要取回自己新增資料的 PK ，此方法不適用。
- 第二種方法比起第一種方法相對好很多，但它僅能傳回 PK。
- 第三種方法應該是最安全及正規的作法，除了 PK 之外，還能查看其餘欄位的值。

---

Thanks for reading the article :tulip: :sunflower: :blossom:

If you like it, please don't hesitate to click heart button :heart:
or follow my [GitHub](https://github.com/FakeStandard) :star:
or buy me a coffee :arrow_down: I'd appreciate it.

[![Buy-me-a-coffee][1]][2]

[1]: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h077sxd0vx1hix4t7lw8.png
[2]: https://www.buymeacoffee.com/FakeStandard

---
10 Essential Tips for Web Development and Coding
Tags: tips, webdev
Published: 2023-04-28 03:18:45

Web development and coding can be a challenging field, but it's also incredibly rewarding. Whether you're a seasoned professional or just starting out, there are always new tips and tricks to learn that can help you improve your skills and take your work to the next level. Here are 10 essential tips for web development and coding:

1. Always use version control: Whether you're working on a solo project or as part of a team, version control is an essential tool for web development and coding. Platforms like Git and GitHub make it easy to keep track of changes and collaborate with others.

2. Write clean, well-organized code: Good code is easy to read and understand. Use meaningful variable names and comments to help make your code more readable. If you're looking for inspiration on how to keep your code clean and organized, check out the code samples on [Drivehub](https://drivehub.com)'s blog.

3. Keep your code modular: Divide your code into reusable modules that can be used across different parts of your site or application. This will make your code more efficient and easier to maintain.

4. Test early and often: Make sure to test your code as you go, so you can catch and fix errors before they become bigger problems.

5. Stay up-to-date on new technologies: The world of web development is constantly changing, so it's important to stay up-to-date on the latest tools and technologies. Attend conferences, read blogs, and join online communities to stay informed.

6. Keep your code secure: Security is a top concern for web development and coding. Make sure to use secure coding practices and stay up-to-date on the latest security threats.

7. Optimize for performance: Site speed is a key factor in user experience. Optimize your code and images to ensure fast load times and a smooth user experience.

8. Use responsive design: With more and more people accessing websites from mobile devices, it's essential to use responsive design to ensure your site looks great on all screen sizes.

9. Stay organized: Keep your files and folders organized so you can easily find what you need. Use naming conventions and logical folder structures to make your files easy to navigate.

10. Don't be afraid to ask for help: Web development and coding can be challenging, but there's always help available. Don't be afraid to ask for help from colleagues, online communities, or support forums.

By following these 10 essential tips for web development and coding, you'll be well on your way to creating great websites and applications that are efficient, secure, and user-friendly.
Random Fact Generator
Tags: githubhack23
Published: 2023-04-28 02:58:03

## What I built 

I build a silly **[Random Fact Generator](https://blue-devil1134.github.io/randomFactGenerator/)** for fun. You can use this if you are bored and want to learn a useless silly fact in life. _Trust me, you get bored daily, you just keep scrolling the web!_

### Category Submission:

I believe my project comes under the the category of "**Wacky Wildcards**". `Build a random app that doesn’t fit into one of the categories above.`

### App Link 📱

Anyone can access this fun project, hosted on gh-pages via gh-actions _[here](https://blue-devil1134.github.io/randomFactGenerator/)_.

### Screenshots

![Screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9uz4sjkmqzxf5m6mb47n.png)


### Description 

It's pretty self explanatory right? All it does is generate a random fact use an api and display it to the user.

### Link to Source Code 

You can find the source code to this on my Github [**here**](https://github.com/BLUE-DEVIL1134/randomFactGenerator).

### Permissive License 

This uses the **[MIT](https://opensource.org/license/mit/)** license.

## Background (What made you decide to build this particular app? What inspired you?) 

I was bored and wanted to learn something fun, silly and useless. So I made this this so that everyone can experience this feeling.😎

### How I built it

I used [gh-actions](https://github.com/BLUE-DEVIL1134/randomFactGenerator/actions) in this project to build it and deploy on the [gh-pages](https://github.com/BLUE-DEVIL1134/randomFactGenerator/tree/gh-pages) branch.

I did learn how to build **tailwindcss** using _gh-actions_ and also how to push these build to _gh-pages_ branch.

### Additional Resources/Info

This project uses a external api!
Code Smell 209 - Side Effects
Tags: webdev, javascript, beginners, programming
Published: 2023-04-28 02:56:29

*Global scope is easy or a nightmare, or both*

> TL;DR: Avoid side effects on your code.

# Problems

- Coupling

- Least Astonishment Principle violation

# Solutions

1. Favor referential transparency

# Context

Referential transparency always produces the same output for a given input and does not have any side effects, such as modifying global variables or performing I/O operations. 

A function or expression is referentially transparent if it can be replaced with its evaluated result without changing the behavior of the program. 

This property allows for easier reasoning about the behavior of a program and enables optimizations such as caching and memorization. 

Functions are treated as mathematical expressions that map inputs to outputs.

# Sample Code

## Wrong

[Gist Url]: # (https://gist.github.com/mcsee/e532e326a6b5ac7d4b88b9aadaa86c0b)
```typescript
let counter = 0;

function incrementCounter(value: number): void {
  // Two side effects
  
  counter += value; 
  // it modifies the global variable counter 
  
  console.log(`Counter is now ${counter}`); 
  // it logs a message to the console.
}
```

## Right

[Gist Url]: # (https://gist.github.com/mcsee/9ce2320f04f2a6f2e0c24e581e472091)
```typescript
function incrementCounter(counter: number, value: number): number {  
  return counter + value; 
  // Not too efficient  
}

```

# Detection

[X] Automatic 

Most linterns can warn you when accessing the global state or [Functions](https://dev.to/mcsee/code-smell-17-global-functions-4b82) and create side effects.

# Tags

- Global

# Conclusion

Functional Programming is amazing and can teach us a lot about how to write clean code. 

We need to understand its pillars.

# Relations

{% post https://dev.to/mcsee/code-smell-17-global-functions-4b82 %}

# Disclaimer

Code Smells are my [opinion](https://dev.to/mcsee/i-wrote-more-than-90-articles-on-2021-here-is-what-i-learned-1n3a).

# Credits

Photo by [Daan Mooij](https://unsplash.com/@daanmooij) on [Unsplash](https://unsplash.com/photos/91LGCVN5SA)
    
* * *

> The most effective debugging tool is still careful thought, coupled with judiciously placed print statements.

_Brian W. Kernighan_
 
{% post https://dev.to/mcsee/software-engineering-great-quotes-26ci %}

* * *

This article is part of the CodeSmell Series.

{% post https://dev.to/mcsee/how-to-find-the-stinky-parts-of-your-code-1dbc %}
Extract and compare css properties with Extract Ease
Tags: css, scrapping, cssextraction, cssscrap
Published: 2023-04-28 02:46:19


Using the URL of any webpage, [Extract ease](https://extractease.in/) **extracts** and **evaluates CSS** code.
With this update, you will now have access to **336 CSS** properties and a **filtering system**.
In addition, we added a new **Element view** to make it easier to compare and view elements.
URL : https://extractease.in/
References : https://www.youtube.com/watch?v=JgBpfN6g7Q8
3 Popular eslint rules that can make your write worse code
Tags: webdev, javascript, react, beginners
Published: 2023-04-28 01:54:25

Eslint is a successful tool to maintain style consistency across the codebase. The problem with it is, if you follow some rules blindly it can lead to worse DX, nonsense refactors and more verbose code. Below is a list of 3 rules that most likely you'll want to question if it's really worth it for you and your team:

#### 1. Prefer default export (from airbnb style guide)   
I did drop default exports for a year now to use only named exports and they are actually (a slightly) better option. They provide a better DX, since you'll have autocomplete. The downside can be conflicts (which can be solved using an as to rename it). Don't refactor your entire codebase just to use it, but keep in mind for the next projects that named exports has better tradeoffs.

#### 2. Consistent returns    
Keeps you from doing such a very practical pattern (early returns). Is likely that you'll end up taking some unnecessary time to refactor your code to a less readable version

#### 3. No param reassign  
There can be compelling reasons to avoid param reassigns, but this downside is minimal given the benefits of a more readable and less verbose code where you just reassign the value from your parameters.

Remember, you don't have to go through a worse experience and do nonsense refactors just to conform to some rule imposed by someone else. When a rule is enforcing you (and your team) to write less readable code, question it, and just disable it if isn't a good idea.
ABOUT ME
Tags: tutorial, programming, webdev, javascript
Published: 2023-04-28 01:24:24

**_Hi everyone, I am Dickson. A medical human physiology graduate, i just started the web development process html, css, javascript, backend and frontend development.
This new career pursuit is due to the fact that there was no good job after graduating since 2018 and i was earning very low so i thought of getting a tutorial which i started and i really love programming ever since a kid i always wanted to be a computer guru lol but is all good am in the process please and please i like to learn more and i am nice and fun to chat most importantly i will like to to learn more so feel free to like my comment and i will follow you immediately._**
I have launched an AI Conversational UX Guide.
Published: 2023-04-28 00:39:07

The proliferation of applications that use language models has caused application developers to consider the unknown conversational UX. This guide summarizes the characteristics of how language models behave in applications and provides guidelines for designing conversational UX.

[uxaidev/AI-Conversational-UX-Guide: 💡 Guides, blogs and applications list for conversational UX](https://github.com/uxaidev/AI-Conversational-UX-Guide)

[AI Conversational UX Guide - AI Conversational UX Guide](https://guide.uxai.dev/)