teleren/devto huggingface dataset:
Creating a link shortener using Bitly's API (In simple steps)
Tags: webdev, programming, tutorial, react
Published: 2024-03-11 10:55:46

Step 1: Create a Bitly account using this link [Bitly sign up](https://bitly.com/a/sign_up)

![Bitly's home page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pc1w580z1qh95j99woz9.png)
Step 2: Just by the side bar, head over to settings. 
![Bitly's side nav](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y8shptsq3cfd1xi7cyt5.png)
Step 3: Head over to developer settings to generate an 
API token.

![Bitly's dev settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9jylkoqqfalf69h5odtc.png)
Step 4: Fill in your password to generate this token.
![Bitly's dev settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a66vxaubq8ve4av1dbf2.png)
Step 5: Head over to VS Code.
Step 6: Install axios using 

```
npm i axios --save
```
Step 7:Create form component

```
<form onSubmit={handleSubmit}>
        <input
          type="text"
          placeholder="Enter a long URL"
          value=''
        />
        <button type="submit">Shorten</button>
      </form>
```
Step 8: Create a state function for your URL values. 
urlInput: This is the long URL the user wants to shorten.
urlOutput: This is the new shortened URL.

```
  const [urlInput, setUrlInput] = useState('');
  const [urlOutput, setUrlOutput] = useState('');

```
Step 9: Create an asynchronous submit function

```
//(e) is an event handler that  
const handleSubmit = async (e) => {

    e.preventDefault(); // To prevent the button from submitting before the function runs, we add e.preventDefault.

//The try-catch function is to run the function smoothly and help us identify errors along the way
    try {
      const res = await axios.post(
        'https://api-ssl.bitly.com/v4/shorten', // the api link
        {
          long_url: urlInput // your url input state value
        },
        {
          headers: {
            'Content-Type': 'application/json',
            Authorization: 'YOUR_API_KEY/TOKEN'
          }
        }
      );
      setUrlOutput(res.data.link);
    } catch (error) {
      console.error(error);
    }
  };
```


Step 10
a. Create a <div></div> for the newly generated API

```
{urlOutput && (
        <div>
          <p>Shortened URL:</p>
          <a href={urlOuput} target="_blank" rel="noopener noreferrer">
            {urlOutput}
          </a>
        </div>
      )}
```
b. Update the values of the form

```
<form onSubmit={handleSubmit}>
        <input
          type="text"
          placeholder="Enter a long URL"
          value={urlInput}
          onChange={(e) => setUrlInput(e.target.value)}
        />
        <button type="submit">Shorten</button>
      </form>
```
That's it!
You've created your url shortener with Bitly's API! Let me know what you think in the comments. Contributions and feedbacks are obviously welcome. Cheers ;)
Conquering Common Coding Challenges: Your Programmer's Toolkit
Tags: webdev, javascript, programming
Published: 2024-03-11 10:54:23

The life of a programmer isn't always sunshine and compiled code. We all face hurdles that can slow us down or even grind progress to a halt. But fear not, fellow coders! This post equips you with strategies to tackle some of the most frequent programming challenges.
1. The Debugging Dilemma: From Chaos to Clarity
The Problem: Error messages flash, logic goes haywire, and your once-promising program becomes a cryptic mess. Debugging can be a time-consuming and frustrating experience.
Your Toolkit:
Divide and conquer: Break down your code into smaller, testable sections. Isolate where the error originates.
Embrace the debugger: Use your IDE's debugging tools to step through code line by line, inspect variables, and identify the culprit.
Befriend print statements: Strategically placed print statements offer a quick glimpse into variable values and code flow.
Community is key: Don't be afraid to seek help online. Programming forums and communities are filled with experienced developers who have likely faced similar issues.
2. Logic Landmines: Avoiding Common Mistakes
The Problem: Logic errors can be insidious. They might not crash your program, but they can produce unexpected or incorrect results.
Your Toolkit:
Rubber duck debugging: Explain your code to an imaginary listener (a rubber duck works well!). Often, the act of verbalizing your logic helps you identify flaws.
Test-driven development (TDD): Write unit tests before implementing your code. This forces you to think through edge cases and ensures your code functions as intended.
Code reviews: Have another developer review your code. Fresh eyes can spot logical flaws you might have missed. See more articles in an [article directory](https://fiksan.com/).


3. Performance Perplexities: Optimizing for Speed
The Problem: Your program chugs along, taking forever to complete its task. Slow performance can frustrate users and hamper your application's effectiveness.
Your Toolkit:
Profiling: Use profiling tools to identify performance bottlenecks in your code. This helps you focus optimization efforts on the areas that matter most.
Algorithmic optimization: Choose efficient algorithms and data structures for your tasks. Sometimes, a slight change in approach can yield significant performance improvements.
Code reuse and libraries: Leverage existing libraries and well-optimized code whenever possible to save development time and ensure efficiency.
These are just a few battle-tested strategies to overcome common coding challenges. Remember, practice makes perfect. The more you code, the better equipped you'll become to handle these hurdles. So keep coding, keep learning, and conquer those programming challenges with confidence!
What do you think about your life as a developer?
Tags: programming, discuss, development
Published: 2024-03-11 10:52:02

Hi guys, I hope you have a great day😉. 

The important thing we have is our time and our life, But we are a developer, and most time we work on something new, and most of these things are for other people and we get money for continuing this circle. Right other jobs are like this also.

Most time people pick up more success for themselves not for each other. I don't know if these sentences are correct or not, But I know some things for us are wrong.

Rich people use other people to be richer than past, This is not about all rich guys but most of them, But if they don't need us afterward sometimes they will leave us aside also. Do we haven't share of the project?

On the other hand, Some developers don't work correctly and they are lazy at work. I think these two issues are linked together.

So developers let's develop our lives and help me by asking these questions😎:

- How do we receive freedom, Is it possible?
- How we can do something that we want, not other people want? 
- How developers can help each other to achieve this purpose? 
- Are we born for other people's lives?
- Why do people not get results on the same work equally according to efforts? Almost it is the opposite.
- If the current way is right how we can find some rich people to work with?
- **If you have any other questions you can ask in comments🗨️**
How to Excel on Your CompTIA A+ 1101 Practice Test
Tags: webdev, javascript, programming, tutorial
Published: 2024-03-11 10:49:25

By cultivating a mindful <a href="https://dumpsvilla.com/comptia/comptia-a-1101-practice-test/">a+ 1101 practice test</a>  approach to studying and test-taking, you can better manage anxiety and optimize performance. Taking Breaks and Managing Time Balancing study and rest Taking regular breaks during study sessions is essential for preventing burnout and maintaining productivity. Effective time management techniques, such as the Pomodoro Technique or time-blocking, can help you allocate time efficiently and prioritize tasks effectively. Developing a <a href="https://dumpsvilla.com/comptia/comptia-a-1101-practice-test/">Comptia A+ 1101 practice test</a>  Positive Mindset Fostering optimism and resilience Cultivating a positive mindset is crucial for overcoming obstacles and bouncing back from setbacks. 

Clich here for more info>>>>>>>> https://dumpsvilla.com/comptia/comptia-a-1101-practice-test/
"High-Speed Internet Leased Line Services in Delhi"
Tags: hosted, ivr, pri, service
Published: 2024-03-11 10:36:31

Are you in need of a high-speed and reliable Internet leased line service in Delhi? Look no further! Our company specializes in providing top-notch 
leased line connections to businesses in cities. With our Internet leased line services, you can enjoy seamless connectivity, uninterrupted internet
 access, and dedicated bandwidth for your organization's critical operations.Our Internet leased lines are designed to meet the demanding needs of businesses,
 offering fast and reliable connectivity that ensures smooth communication, efficient data transfer, and enhanced productivity.
 Contact us now to discuss your requirements and experience the power of a reliable and high-speed leased line connection in Delhi. toll free no.+911142908899
url:-https://www.telecomssupermarket.co.in/services/internet-leasedline
Introduction to Next.js
Tags: learning, nextjs, react, beginners
Published: 2024-03-11 10:28:44

Delving into Next.js is essential for any seasoned developer. This robust React framework brings forth a myriad of benefits. Mastering Next.js equips you with the tools to craft web applications that are not just efficient and scalable but also embrace modern web development practices.

## What is Next.js?
Next.js is a React framework for building full-stack web applications. It offers an excellent developer experience and comes with many built-in features.

## Getting started with Next.js 
### Prerequisites:
Before we begin, make sure you have a strong knowledge of HTML, CSS, JavaScript, and React JS.

#### Create your first Next.Js app:

Open your terminal and use the following commands to create a new Next.js project:
```
npx create-next-app my-nextjs-app
cd my-nextjs-app
```
Replace _my-nextjs-app_ with your preferred project name. This will set up a basic Next.js project structure for you.

#### Exploring the Project Structure:
Only files & folders inside the **_app_** folder are considered for rendering.
_**page.js**_: This file is used to render the pages. This file defines the content of the page. 
**_layout.js_**: This file defines the shell around one or more pages. It runs HTML and body tags. We don't have a head section in the layout.js's HTML tag as the title and description are defined in "metadata".
![Metadata-Example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jj3v2hntdnbku7drtplc.png)
**_icon.png_**: When we will define this then this image will be considered a favicon.
#### Start the Development Server: 
To run the local server-
```
npm run dev
```
#### Create a new page:
In the app, add a new directory **_about_** and add a new _page.js_ file. 

![About Page folder](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rn67dl90fknyu8z6zc4q.png)
```
/about/page.js

export default function AboutPage() {
  return (
    <main>
      <h1>About Us</h1>
    </main>
  );
}
```
This will create a _http://localhost:3000/about_ page. The content should be written on the page.js file.
##Conclusion
Bravo! You started learning the next.js and created a new page. Feel free to create more pages and explore. Keep learning and experimenting!
Conquering Common Coding Challenges: Your Programmer's Toolkit
Tags: webdev, javascript, beginners, programming
Published: 2024-03-11 10:18:09

The life of a programmer isn't always sunshine and compiled code. We all face hurdles that can slow us down or even grind progress to a halt. But fear not, fellow coders! This post equips you with strategies to tackle some of the most frequent programming challenges.
1. The Debugging Dilemma: From Chaos to Clarity
The Problem: Error messages flash, logic goes haywire, and your once-promising program becomes a cryptic mess. Debugging can be a time-consuming and frustrating experience.
Your Toolkit:
Divide and conquer: Break down your code into smaller, testable sections. Isolate where the error originates.
Embrace the debugger: Use your IDE's debugging tools to step through code line by line, inspect variables, and identify the culprit.
Befriend print statements: Strategically placed print statements offer a quick glimpse into variable values and code flow.
Community is key: Don't be afraid to seek help online. Programming forums and communities are filled with experienced developers who have likely faced similar issues.
2. Logic Landmines: Avoiding Common Mistakes
The Problem: Logic errors can be insidious. They might not crash your program, but they can produce unexpected or incorrect results.
Your Toolkit:
Rubber duck debugging: Explain your code to an imaginary listener (a rubber duck works well!). Often, the act of verbalizing your logic helps you identify flaws.
Test-driven development (TDD): Write unit tests before implementing your code. This forces you to think through edge cases and ensures your code functions as intended.
Code reviews: Have another developer review your code. Fresh eyes can spot logical flaws you might have missed. See more articles in an [article directory](https://toprankdirectory.in/).


3. Performance Perplexities: Optimizing for Speed
The Problem: Your program chugs along, taking forever to complete its task. Slow performance can frustrate users and hamper your application's effectiveness.
Your Toolkit:
Profiling: Use profiling tools to identify performance bottlenecks in your code. This helps you focus optimization efforts on the areas that matter most.
Algorithmic optimization: Choose efficient algorithms and data structures for your tasks. Sometimes, a slight change in approach can yield significant performance improvements.
Code reuse and libraries: Leverage existing libraries and well-optimized code whenever possible to save development time and ensure efficiency.
These are just a few battle-tested strategies to overcome common coding challenges. Remember, practice makes perfect. The more you code, the better equipped you'll become to handle these hurdles. So keep coding, keep learning, and conquer those programming challenges with confidence!
Oracle Database: How to Create/Delete New User and Grant Privilege?
Tags: programming, tutorial, sql, database
Published: 2024-03-11 10:00:00

## Introduction

Proficiency in database management is an essential skill for data analysts. Oftentimes, colleagues from different departments need quick access to specific datasets, making the traditional method of exporting Excel files from databases inefficient and time-consuming. A more effective approach involves creating new user accounts in the database and granting them appropriate viewing rights. This allows colleagues to seamlessly connect to the database using tools like Power BI or Power Query, enabling them to access necessary data tables promptly and efficiently. This streamlined process fosters collaboration and supports data-driven decision-making across organizational departments.

## Creating a new user

To create a new user in the Oracle database, you can execute the following SQL command:

```sql
CREATE USER 'USERNAME' IDENTIFIED BY 'PASSWORD';
```

For example:

```sql
CREATE USER TEST_USER IDENTIFIED BY TEST123;
```

## **Granting the Connect Role**

After creating a new user, attempting to connect may result in an error message:

```
[72000][1045] ORA-01045: user TEST_USER lacks CREATE SESSION privilege; logon denied
```

To enable the user to connect to the database, you must grant the CONNECT role:

```sql
GRANT CONNECT TO TEST_USER;
```

Merely connecting is not enough - make sure to grant the RESOURCE privilege to allow access to the tables.

```sql
GRANT CONNECT, RESOURCE TO TEST_USER;
```

## Table privilege

To grant specific privileges on tables to a user, you can utilize the GRANT command on specific table TO user. For example:

```sql
GRANT SELECT ON schema.table_name TO TEST_USER;

```

If you wish to provide the user with options beyond selection, such as insertion, updating, and deletion, you may proceed with the execution of the following command.

```sql
GRANT SELECT, INSERT, UPDATE, DELETE ON schema.table_name TO TEST_USER;
```

## Delete a user

To remove a user from the database, you can execute the following SQL command:

```sql
DROP USER TEST_USER;
```

---

## Explore more

{% embed https://dev.to/luca1iu %}


Thank you for taking the time to explore data-related insights with me. I appreciate your engagement.

{% cta https://www.linkedin.com/in/lucaliu-data %} 🚀 Connect with me on LinkedIn {% endcta %}

{% cta https://twitter.com/Luca_DataTeam %} 🎃 Connect with me on X {% endcta %}


{% cta https://www.instagram.com/luca1iu?igsh=MmJneDFpdjNtYWU1&utm_source=qr %} 🌍 Connect with me on Instagram {% endcta %}
Dark Mode
Tags: html, css, javascript, developer
Published: 2024-03-11 09:59:20

Life is already complicated.<br>

dark mode doesn't have to be.

---

add a class to an SVG to use as a toggle

<code>class="dark-mode-svg" onclick="toggleDarkMode()"</code>

 .dark-mode {
            background-color: #333;
            color: grey;
        }

 .dark-mode-svg {
            fill: #333;
            color: grey; 
            width: 100px;
            height: 100px;
            margin-top: 50px;
            margin-left: 900px;
            cursor: pointer;

```
function toggleDarkMode() {
  const body = document.body;
  const isDarkMode = body.classList.contains("dark-mode");
  body.classList.toggle("dark-mode", !isDarkMode);
}
```
{% codepen https://codepen.io/sudo-self/pen/zYXqWGm %}
Master the Art of Database Comparisons with PowerShell and dbForge Studio for SQL Server
Tags: sql, sqlserver, devart, dbforge
Published: 2024-03-11 09:58:27

It is common practice for database administrators and developers to compare and synchronize data from different tables and schemas in different databases. When dealing with development, test, staging, or production databases, it is crucial to identify the target environments and deploy changes there. Efficient multi-database comparisons are possible thanks to the automation of such mundane operations.

Database synchronization and comparison tools like Schema Compare and Data Compare are included in Devart's dbForge product range. These two tools are designed to work with major database systems such as SQL Server, MySQL, Oracle, and PostgreSQL. You may use them separately or as part of their versatile Studios IDEs. Using Windows PowerShell and dbForge Studio for SQL Server, this article explores automating database comparisons: https://blog.devart.com/multiple-database-comparisons-with-powershell-script.htmlb
What is JAMstack?
Tags: jamstack, javascript, frontend, webdev
Published: 2024-03-11 09:56:35

In today’s fast-forward web development landscape, new technologies and methods are popping up all the time, promising faster, better, and safer ways to create websites. One such methodology that’s becoming increasingly popular is Jamstack.

**JAMstack** stands for **<u>JavaScript, API, and Markup</u>**, but it’s not a particular technology or framework. Instead, it’s a modern web architecture that moves away from the server-centric model and towards a distributed, decoupled approach.

## The Evolution of Jamstack:

The history of Jamstack goes back to the beginning of web development. Back then, developers were looking for ways to make websites faster, safer, and more responsive. As JavaScript frameworks such as React, Vue, and Angular grew in popularity, developers started looking for new ways to use client-side rendering to create faster, more dynamic web experiences.

## Innovators of the Jamstack:

Back in the mid-to-late-2000s, some of the most prominent web development pioneers (Matt Biilmann, Chris Bach) coined the term “jamstack” and argued for a new approach to web development. Jamstack focused on the advantages of pre-building a website and serving it as a static file from a CDN (content delivery network), rather than creating pages dynamically on every request.

Would you like to read the rest of the post? Here it is [What Is JAMstack?](https://www.swhabitation.com/blogs/what-is-jamstack) 

Don't forget to follow us on [Medium](https://medium.com/@swhabitation/) for more engaging content covering web development and technology!
Free FigJam (40+) Whiteboards Teams Templates
Tags: figma, figjam, ui, uidesign
Published: 2024-03-11 09:55:49

Discover the versatility of FigJam with our collection of over 40 free whiteboard templates designed for collaborative teams. Whether you're diving into brainstorming sessions, refining team strategies, or mapping out intricate diagrams, FigJam offers a comprehensive set of tools to streamline your process. From user personas to scrum boards, each template is tailored to enhance productivity across various project phases.

> See Also
[FigJam Free User Journey Map Template](https://neattemplate.com/figjam/figjam-free-user-journey-map-template/)

Explore our selection of templates, including brainstorming, flowcharts, Kanban boards, and more, to empower your team's creativity and organization. With FigJam, planning becomes effortless as you leverage intuitive tools like mind maps and roadmaps to visualize concepts and streamline communication. Download your free FigJam templates today and elevate your team's collaboration to new heights.

**Author**: Zvonimir Juranko
[Download(https://www.figma.com/community/file/981568775334764914)

(https://www.figma.com/community/file/1344658008001517704)
### See Also
✍[5+ Free Figma Login Page with Image Template](https://neattemplate.com/figma-templates/5-free-figma-login-page-with-image-template/)
✍[Figma Free 30 Screens eCommerce UI Kit](https://neattemplate.com/figma-mobile-app/figma-free-30-screens-ecommerce-ui-kit)
✍[Figma Free Glassmorphism Presentation Template](https://neattemplate.com/figma-templates/figma-free-glassmorphism-presentation-template/)
✍[Figma Freebie Glassmorphism Icons Simplified](https://neattemplate.com/figma-icons/figma-freebie-glassmorphism-icons-simplified)
✍[24+ Free Figma x Lottie Animated Emoji Pack](https://neattemplate.com/figma-icons/24-free-figma-x-lottie-animated-emoji-pack/)
✍[Figma Free Glassmorphism Presentation Template](https://neattemplate.com/figma-templates/figma-free-glassmorphism-presentation-template/)
Mastering Git: Effortless Branch Renaming on Visual Studio Code's Terminal
Tags: git, branching, webdev, vscode
Published: 2024-03-11 09:45:44

Are you curious about how to efficiently rename branches within your IDE, particularly Visual Studio Code (VsCode), using Git commands? Renaming branches can help ensure your branch name aligns with the specific fixes or features you’ve been working on. Here is a simple guide on how to do that seamlessly:

To rename a branch, leverage the -m flag within Git:

`git branch -m new-branch-name`    

For instance, suppose your current branch is named add-product, and you aim to retitle it as feat/create-product-component.

`git branch -m feat/create-product-component`

To confirm that your branch name is updated or changed, execute `git status` or `git branch` (which will provide you with a list of all your branches).

This straightforward process allows you to maintain clarity and organization within your project by aligning branch names with the respective tasks or features they represent.