teleren/devto huggingface dataset:
Migration from Medium to Hugo + dev.to API
Tags: blog, webdev, cms
Published: 2024-05-09 14:51:36


![Photo by Stephen Phillips - Hostreviews.co.uk on Unsplash](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p9i2krmml9b2n1z53jn6.jpg)

For a long time, we've been running a corporate blog on Medium, but recently, we've run into some problems:

**Problems with Google Indexes.**
   Google started flagging issues with the structure of our articles, causing them to fall out of the search index and negatively impacting our visibility in search results.

**They should have integrated Google Analytics.**
   We encountered the issue of Google Analytics disappearing for our blog on Medium, hindering our ability to track and analyze visitor data.

**Support sub-path /blog.**
   Having a blog as a path on our domain enhances our domain rank, a feature not achievable with Medium.

## Simplify subsequent blog migration through Headless CMS.

We have changed blog engines several times and spent much time on migration, and developers would not like to change tools each time. We decided to set up one CMS to store all our posts and sync those posts across different blog engines or platforms separately.

Considering the wide variety of Headless CMS options available today, categorized into self-hosted/cloud-hosted, API-based/git-based, and no headless(static), we have started exploring modern options for managing a technical blog.

Due to some of our articles already being on the dev.to, we decided to check whether this platform can be used as a Headless CMS. 

**So, what advantages have we found in using dev.to:**
- Free.
- Convenient API. We can receive an article in Markdown form and data for SEO optimization.
- Our authors are already familiar with the dev.to interface, and the process of writing posts has already been set up for them.
- dev.to can be used as a storage for media files for our articles.

It is handy to receive articles in Markdown format as we use **Hugo**, a static site generator for our corporate website. Hugo handles Markdown files, and it would be convenient if the blog also operated on Hugo, reducing the number of tools used.

##Migration approach

1. **Migrate posts from Medium to dev.to:** This can be done in various ways, including online tools, a browser extension, or a custom script.

2. **Add synchronization with dev.to:** Develop a script that runs at set intervals. It saves a dev.to articles with SEO metadata as Markdown files on our server.

3. **Update blog with new posts:** Thanks to Hugo, posts automatically appear on our blog after the synchronization script is triggered.

4. **Prevent SEO problems with migration:** Set up redirects so article links lead to the new blog.

We expect the new approach will help us increase website traffic and save time on publication. We will eliminate unnecessary tools. For our authors, nothing will change as the article writing process remains the same – they publish posts on dev.to while the rest of the process is automated. We will monitor how our SEO metrics change and write an article with the results.
Innovative Healthcare Solutions: Recognized App Development Company
Published: 2024-05-09 14:50:28

Elevate healthcare experiences with our award-winning [healthcare app development company](https://www.technbrains.com/industries/healthcare-app-development), Seamless. Our mission is to revolutionize the healthcare industry by providing seamless, secure, and user-centric solutions. Whether you're a healthcare provider or a patient, our apps are designed to enhance your experience and streamline your processes. Join us in shaping the future of healthcare technology and discover the difference Seamless can make in your life.
ERROR:'XYZ' property doesn't exist on the type 'ABC'
Tags: javascript, typescript, react, errors
Published: 2024-05-09 14:38:36

I was trying to map nested object, and I got this error 
_'XYZ' property doesn't exist on the type 'ABC'_
 

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


I was accessing the properties using dot notation in get-lodash function. It didn't work so I got to know another approach to access properties. It is square brackets notation.

Let me elaborate using example 
This is the Object 

```
let company = {
    name: "Amazon",
    contact: {
        phone: "88076281093",
        email: "amazon123@xyz.com",
        address: {
            city: "Pune",
            country: "India"
        }
    }
};

```
Dot notation to access it : 

```
console.log(company.contact.email);              
console.log(company.contact.address.city);`
```

Square Bracket notation to access it :

```
console.log(person["contact"]["email"]);             
console.log(person["contact"]["address"]["country"]);

```
OR 

```
console.log(person["contact","email"]);             
console.log(person["contact","address","country"]);

```
Also in #typescript when you define type for nested object you can do it in this way 

```
let company = {
name: string,
phone: number,
email: string,
city: string,
country: string
}
```

Hope it helps if you are struggling..

Reference link:https://www.geeksforgeeks.org/how-to-access-and-process-nested-objects-arrays-or-json/
Zapier Alternatives: Automatisch.io and N8N ⚡️
Tags: automation, programming, opensource, api
Published: 2024-05-09 14:31:01

**A good developer is a lazy one**, by automating everything.

Now complex automation is available for non-developers thanks to NoCode plateforms: Zapier, Bubble, Make, or IFTTT. However, <u>you must pay for each flow/action executed</u>, and that's annoying.

![Star wars meme](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fexs64qv8f5cimmw8w9n.png)

Two open-source alternative solutions are available to host on your own server:

## N8N

> Link to the Github repository: https://github.com/n8n-io/n8n

You can create automation flow with 400 integrations ([list of integrations](https://n8n.io/integrations/)). If you need help, the community is quite active with 55385 members.

![N8N flow example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pz61xl6wpo5nxta2omow.png)

Advantages for developers:
- You can code in JavaScript or Python, with Conditional logic and branching
- Use external NPM or Python libraries.
- More than 1000 templates are already available.
- Create your own API integration, a rich documentation and tutorials are available

Deployment guides are available for the most known Cloud providers, and guides to deploy on your own server with Docker-compose: https://docs.n8n.io/hosting/installation/server-setups/

## Automatisch.io

> Link to the Github repository: https://github.com/automatisch/automatisch

Described as the "Open source Zapier alternative", Automatisch is a Nocode emerging solution, but growing daily with +4000 stars on Github and they are supporting currently 48 integrations ([list of supported apps](https://automatisch.io/docs/guide/available-apps)).

![Automatisch example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/he6xc3vv1vql05yxkwrr.png)

Advantages for developers:
- Easy to deploy and maintain with Docker: https://automatisch.io/docs/guide/installation#docker 
- Easy to create automation flows
- You can create your own integration, it is well documented: https://automatisch.io/docs/build-integrations/folder-structure
- If you need any help, the two founders of the project are available anytime on Twitter/Discord/Linkedin to chat.

## Conclusion

If you want to automate, I would recommend to use:
* **N8N** for building technical and complex flows, for instance adding conditional logics and code.
* **Automatisch.io** for building flows without needing a lot of technical knowledge.

Have a great day!
expert
Published: 2024-05-09 14:24:26

[https://inforen.ru/2022/08/kak-vybrat-ekshn-kameru/
](https://inforen.ru/2022/08/kak-vybrat-ekshn-kameru/
)
Стабилизация изображения является одной из ключевых характеристик экшн камер. Ведь при активном движении важно, чтобы видео было ровным и без размытий.  Функциональность экшн камеры также играет важную роль в принятии решения при ее выборе. Многие современные модели оснащены дополнительными возможностями, такими как Wi-Fi или Bluetooth соединение, водонепроницаемый корпус, GPS и другие функции. Это позволяет использовать камеру в различных условиях и делает съемку более удобной и интересной. При выборе экшн камеры стоит также обратить внимание на ее размеры и вес. Компактность и небольшой вес камеры обеспечивают удобство при транспортировке и использовании. Однако, помните, что компактные модели могут иметь некоторые ограничения в функциональности и качестве съемки. При рассмотрении различных моделей экшн камер, рекомендуется обратиться к рейтингам и обзорам на сайте Expert.Top, чтобы получить полную информацию о размерах и весе каждой модели, а также о их возможностях и особенностях.
JWT Explained
Tags: jwt
Published: 2023-02-20 06:39:34

##JWT
JWT stands for JSON Web Token, which is a compact, URL-safe means of representing claims to be transferred between two parties. JWTs can be used for authentication and authorization, as well as for passing data between systems in a secure and trusted way. Here is some information about JWTs:

**Structure**: A JWT consists of three parts separated by dots: a header, a payload, and a signature. The header contains information about the algorithm used to sign the token, the payload contains the claims or data that the token represents, and the signature is used to verify the authenticity of the token.

**Claims**: JWTs contain claims, which are statements about an entity (typically, the user) and additional metadata. There are three types of claims: registered claims, public claims, and private claims. Registered claims are predefined by the JWT specification, public claims are defined by the application, and private claims are custom claims agreed upon between parties that use them.

**Signing and verification**: JWTs can be signed using a secret key (HMAC) or a public/private key pair (RSA or ECDSA). The signature is used to verify that the sender of the JWT is who it says it is and to ensure that the message wasn't changed along the way.

**Authentication**: JWTs can be used for authentication by issuing a token to a user upon successful login. The user's identity can be stored in the token, and the token can be used to access protected resources without the need to repeatedly authenticate the user.

**Authorization**: JWTs can be used for authorization by including additional claims in the token that define the user's permissions or roles. These claims can be used to control access to protected resources based on the user's permissions or roles.

**Stateless**: JWTs are stateless, meaning that the server does not need to keep track of any session state for the user. This can improve scalability and reduce the amount of network traffic required for authentication and authorization.

**Security considerations**: When using JWTs, it is important to protect the secret key or key pair used to sign the tokens. JWTs should also be transmitted over a secure channel, such as HTTPS, to prevent interception or tampering of the token.

Overall, JWTs are a popular and widely used method of securely transmitting data between systems. They provide a compact and standardized way to represent claims, and can be used for both authentication and authorization in a stateless and scalable manner.
D5L Dictionary
Tags: python, dictionary, tkinter, flatpak
Published: 2024-05-09 14:24:23

Hello there, i am working on a simple dictionary with Python using PyMultiDictionary module. I published it in Github under the name [D5L repository](https://github.com/storlak/PythonMiniProjects/tree/main/003%20-%20D5L%20Dictionary). It has an interface made with tkinter and at the moment it can be used in 5 languages. It is searching for meaning, synonym and antonyms of the words. There are few problems with PyMultiDictionary module but it works fine.

For windows you can download it from [Release page](https://github.com/storlak/PythonMiniProjects/releases) in Github. To feel safe, you can also clone the [repository](https://github.com/storlak/PythonMiniProjects/tree/main/003%20-%20D5L%20Dictionary) and run it on you IDE.

I want to convert this script to flatpak and AppImage and publish it on flathub and i definitely need help or guidance about converting this. If anyone can assist for flatpak, AppImage please [contact me](https://github.com/storlak).


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dvddkyfisbbghk046jfo.png)
What Is Cross-Site Scripting (XSS) and How Does It Work?
Published: 2024-05-09 14:22:06


![What Is Cross-Site Scripting (XSS) and How Does It Work?](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d7b0tt87bbqbltn4thtv.jpg)


In today's digital realm, understanding the threat posed by Cross-Site Scripting (XSS) attacks is crucial. XSS exploits trust within web environments by injecting malicious scripts into seemingly safe websites, compromising user security and privacy.

XSS attacks operate through a series of steps: injecting malicious scripts into user input fields, exploiting vulnerabilities in web application security, and executing harmful actions within users' browsing sessions. These attacks come in various forms, including Reflected XSS, Stored XSS, DOM-based XSS, and Mutated XSS, each presenting unique challenges for detection and mitigation.

Proactive testing is essential in identifying XSS vulnerabilities. Manual testing methods, combined with automated tools such as web vulnerability scanners and static code analysis, enable users and developers to detect and address vulnerabilities effectively.

Ethical considerations play a vital role in XSS testing. Obtaining permission from website owners, prioritizing education over exploitation, and adhering to responsible disclosure practices are essential for fostering a culture of ethical hacking.

Mitigating XSS vulnerabilities requires a multifaceted approach. Users should exercise caution with user-generated content, maintain vigilance in browsing habits, and leverage security features such as browser protections and web application firewalls to enhance resilience against XSS attacks.

In conclusion, understanding and defending against XSS attacks are critical in safeguarding web environments against malicious exploitation. By staying informed, remaining vigilant, and implementing proactive defense strategies, users and developers can fortify the digital realm against XSS threats.
Introducing xBesh UI: A Free, Open-Source UI Library for React and Next.js Developers
Published: 2024-05-09 14:22:03

As developers, we're always on the lookout for tools and resources that can streamline our workflow and help us build better applications faster. 

Today, I'm excited to introduce you to [xBesh UI](https://xbesh.dev) - a brand new, free and open-source UI kit designed specifically for React and Next.js developers.

xBesh UI is a comprehensive UI library that provides over 100 high-quality UI components that you can easily integrate into your projects. From basic building blocks like buttons, inputs, and typography to more advanced components like modals, carousels, and data visualizations - xBesh UI has you covered.

##  Why xBesh UI?
There are a lot of UI kits out there, so what makes xBesh UI stand out? Here are a few key reasons to consider using it for your next project: 100% Open-Source and Free: xBesh UI is licensed under the MIT license, which means it's completely free to use, modify, and distribute. No hidden fees or strict licensing requirements.

### Built for React and Next.js: 
Unlike generic UI kits, xBesh UI is designed from the ground up to seamlessly integrate with the React and Next.js frameworks. The components are built using React and leverage the latest features and best practices.

### Extensive Component Library: 
With over 100 customizable UI components, xBesh UI provides an extensive toolkit to build highly functional and visually appealing user interfaces.

### Responsive and Themeable: 
The components are built with responsive design in mind and can adapt to various screen sizes. Additionally, the theming system allows you to easily customize the styles to match your brand.

### Actively Maintained: 
The xBesh UI project is actively maintained by a dedicated team of developers who are committed to regularly adding new components, improving existing ones, and fixing any issues that arise.

## Getting Started with xBesh UI
Using xBesh UI in your project is straightforward. Simply install the package via npm or yarn, and you're ready to start building:

```jsx
npm install @xbeshui/core
# or
yarn add @xbeshui/core
# or
pnpm install @xbeshui/core
# or
bun add @xbeshui/core
```

Once installed, you can import and use the components in your React or Next.js application. For example, to use the Button component:

```JSX
import { Button } from '@xbeshui/core';
function MyComponent() {
  return (
    <div>
      <Button variant="outline">Click me</Button>
    </div>
  );
}
```

The xBesh UI documentation site provides detailed guides, component examples, and information on customizing the UI kit to fit your specific needs.

### Contribute to xBesh UI
As an open-source project, xBesh UI welcomes contributions from the developer community. If you've found a bug, have a feature request, or would like to contribute your own components, we encourage you to get involved. You can find the [project repository on GitHub](https://github.com/madhavdutta/xbeshui) and learn more about the contribution guidelines.

We're excited to see how the community embraces and utilizes xBesh UI in their projects. Happy coding!
Interview with Kareem Ebrahim, creator of TableX
Tags: rust, tauri
Published: 2024-05-09 14:16:13

Welcome to the 8th and final episode of Season 1 of our series “Building with Tauri”, where we chat with developers who build amazing projects and products using [Tauri](https://tauri.app/).

In this episode, [Eleftheria](https://twitter.com/BatsouElef) discusses with [Kareem Ebrahim](https://github.com/kareemmahlees), TableX’s creator:

* How he started
    
* What is [TableX](https://github.com/kareemmahlees/tablex) and how does it differ from other tools?
    
* Working solo and tech stack
    
* Challenges and the [DevTools](https://crabnebula.dev/devtools)
    
* Upcoming features and goals
    

In the following video, Kareem shows us in detail [TableX](https://tablex-tan.vercel.app/):

> *Table viewer for modern developers. Database browsing experience like never before -* [*TableX*](https://tablex-tan.vercel.app/)

{% embed https://youtu.be/3TI_B0ufrfc %}

## Find Out More 🔗

* Learn more about TableX [here](https://github.com/kareemmahlees/tablex).
    
* Find Kareem on [LinkedIn](https://www.linkedin.com/in/kareem-ebrahim-a82375234/).
    
* We also discussed [DevTools](https://crabnebula.dev/devtools/). Gain insight into your Tauri apps for free!
    
**Have you built something cool with Tauri? Ping Eleftheria (username: eleftheria\_b) on** [**Discord**](https://discord.gg/tsvf4TEaB5) **to schedule your interview! This is your chance to demonstrate your product to a community of thousands of developers. 😏**

---

_Author: @eleftheriabatsou, community manager at @crabnebuladev_
I Made a Dungeons and Dragons Name Generator to Help You Create Perfect Character Names!
Published: 2024-05-09 14:11:15

As a developer and a Dungeons and Dragons enthusiast, I wanted to make it easier for players to come up with cool, fitting names for their characters. That's why I created the [Dungeons and Dragons Name Generator](https://dnd-name-generator.com/es). It's a simple tool that helps you find the perfect name based on your character's gender, class, race, and personal traits. Whether you're a seasoned player or just starting out, this tool is designed to spark creativity and add depth to your role-playing.

The [Dnd name generator](https://link.zhihu.com/?target=https://dnd-name-generator.com/) is straightforward: you input details about your character, choose how many names you want to see, and even add a custom message to get names that feel just right. I built it to blend seamlessly with D&D's lore, making sure each name feels authentic. It's rewarding to see other players use this tool to enhance their games and bring their characters to life.

Here's the link: [Dnd name generator](https://dnd-name-generator.com)
Introducing Open Source Super app "Ethora Engine"
Published: 2024-05-09 14:05:37

## 
🚀 Exciting News: Introducing Ethora Engine - The Open Source Super App Engine! 🚀

🌟 What is Ethora Engine? 🌟
Ethora Engine is your ultimate web3 'super app' engine. It is low-code and highly customizable, allowing you to launch your own branded app on the app store in no time. Packed with web3 features, Ethora Engine can play a pivotal role in growing your business or community.

Thinking of building a new app? Ethora Engine offers a great chance to save money and development efforts.

🔥 Why Ethora Engine? 🔥
✨ Open Source: Ethora Engine is open-source, giving developers full access to the code for customization and contribution to ongoing development.
✨ Super App Features: Ethora Engine comes with out-of-the-box features like 
- Chat/Messaging (Group and 1:1 instant messaging for connecting users), 
- Social Sign-On, 
- Push Notifications, 
- Gamification, and 
- Digital Assets (Media, Documents, NFTs created, owned, shared, and transferred by users). 
- It also includes Chat Bots for various functions (Games, raffles, tech support, e-commerce, ChatGPT - add the bots you need!).
✨ Easy to Use: With Ethora Engine's intuitive interface and low-code approach, developers can build apps faster and more efficiently than ever before. Even citizen developers can build apps in no time with tech support.

> 
We built this engine so you can focus on your core business and growing your community, without spending months or years on building foundational tech.

🚀 Get Started with Ethora Engine Today! 🚀
Join the Ethora Engine community and start building powerful apps that users will love. Whether you're a seasoned developer or just starting, Ethora Engine makes app development fun and accessible for everyone.

👉 Learn more about Ethora Engine and join the community at [https://ethora.ethoradev.com/signIn?signUpPlan=free](https://ethora.ethoradev.com/signIn?signUpPlan=free)

You can also take a peek into our code for implementing your project: [https://github.com/dappros/ethora](https://github.com/dappros/ethora) or clone the repo, change the splash screen, and build your app on top of our engine if you like how things are arranged there.

**We welcome any feedback!**