teleren/devto huggingface dataset:
Generate Free SSL Certonly
Tags: ssl, security, https, letsencrypt
Published: 2023-09-29 15:03:11

## Generate SSL

Run the following command in your command line

```bash
sudo certbot -d rupadana.my. id --manual --preferred-challenges dns certonly
```


So, next you will be asked to add a DNS TXT Record to your domain


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

## Add TXT Records

Next, you log in to your DNS Zone Editor and add a TXT Record with the name and content provided by certbot


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

## Check DNS Records

After adding the DNS Text Record, now check https://dnschecker.org


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

## Generate Success

You have successfully generated a certificate file from Let's Encrypt. Next, you only need to configure your web server / proxy


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


## Place the certificate
You can access the certificate that you generated in the `/etc/letsencrypt/live/domain.com` directory domain.com
Building doxshare[0]: The beginning
Tags: buildinpublic, react, webdev, javascript
Published: 2023-09-29 14:59:13

---
series: Building doxshare
---

Greetings fellow programmers,
It's been an amazing journey since I started this project called "doxshare".  I've been building for almost 2 weeks now. I thought I could complete the MVP in a week or so, but I've been busy lately.
## A look back
My vision is to create something like [pastebin](pastebin) but better. I wanted to create a pastebin alternative which lets you create and share Notion like documents. I am using [T3 stack](https://create.t3.gg/) for this project since it's everything I needed combined. 
## Milestones achieved
### User friendly and beautiful UI
I've chosen [shadcn/ui](https://ui.shadcn.com/) to style my app. As per the docs, it's not a component library but it rather provides beautiful and customizable copy-paste components which you can use in your applications. It's built upon [radix-ui](https://www.radix-ui.com/) and tailwind. It also provides features such as dark mode, themes etc.

![shadcn-ui](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/natd9i918hv10dflrgl4.png)


### Core functionalities
I've created the basic and important functionalities like authenticating the user, creating document, sharing document, document expiration. And many more functionalities are still left to be made which I'm thinking to complete as soon as possible.


![doxshare](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/odrafyd3tc57f0i9huln.png)


### Dashboard
I've created a dasboard with a data-table in it where a user can see all the documents created.

![dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2t1n0xd7c1516rwyeasi.png)


## Future Endeavors
### Document privacy 🔐
I am planning to be able to password protect the documents when user needs it. It's not mandatory but the user has the option to password protect it in-case if he wants.
### Revive Expired documents 🧬
I want to be able to give the user ability to regenerate the shareable link of the expired documents, so that they could be shared again.
### AI completion 🤖
WIth [novel](https://novel.sh) AI autocompletion feature, I'm planning to include AI feature into the app.
### Collaborative Environment 👩‍💻
I am also planning to create a collaborative environment where multiple users can simultaneously edit the documents.

## Conclusion
The success of "doxshare" is a result of the support from the community. I invite you to follow the GitHub repository, contribute code, report issues, or simply spread the word. 

If you liked the idea for this project, feel free to give the [repo](https://github.com/shaan-alam/doxshare) a ⭐ 

Stay tuned for more updates and exciting announcements. Let's redefine collaboration, one document at a time!

Thank you for being part of the **doxshare** community.
## Follow me online
X - [https://twitter.com/shaancodes](https://twitter.com/shaancodes)
Instagram - [https://instagram.com/shaancodes](https://twitter.com/shaancodes)
GitHub - [https://github.com/shaan-alam](https://github.com/shaan-alam)
Phase 1 FlatIron
Tags: javascript, beginners, programming
Published: 2023-09-29 14:57:34

Hello to whoever is reading this so for the first phase at Flatiron I will talk about how different programming with JavaScript and HTML when compared to C# in Unity, at least to me. So to begin with creating a script in Unity regardless of whether it's in 2D or 3D has a default template while JavaScript does not and as far as I know doesn't need one since the script you're writing can vary depending on the project you are working on. HTML probably has the same case although I believe there are plugins to have the very basics like <!DOCTYPE HTML> and the <head> and <body> elements in the script by default but just like JavaScript the rest of the script will most likely look very different when compared to another HTML script from a different project. Another comparison I would like to make is between Unity methods and JavaScript functions they're both used only when called by another part of the script, and they're both used to hold code that will more than likely get repeated and can both take in different parameters that they will need to use to return the right outcome. The biggest difference between the two of them is the fact that in Javascript functions need to be declared with the word function followed by their name paratheses parameters if you need them and brackets while in Unity methods are declared with either void if they return nothing or the datatype they need to return followed by it's name with parentheses, parameters and brackets. Then there were how different and similar variables were, of course, there were still integers, floats, booleans, and strings but not in the same way in Unity you declare a variable with its assigned datatype meaning it can only ever be an integer or one of the others and to be fair you can change it by using a method similar to parse float or int but you would then need to store that value in a new variable to use it. And in Javascript that isn't the case so far we have only been using const or let which can be any datatype and change between them which made writing in Javascript a little difficult since I wasn't used to writing code that way. The last comparison and the most interesting one to me is how the scripts themselves run, Unity code can only run if it is called or written between one of the main methods that run code, like void start or void update, this also makes it easier to structure code and read since if you know what you're trying to find know where to look. On the other hand, JavaScript can be written, at least to my current knowledge, anywhere of course there are ways to structure it on your own like making sure variables are made before they are called or else you won't be able to use them. Because of this during the first week writing in JavaScript was pretty difficult because I wasn't sure where some lines, functions, and variables should go.
Install and Manage Supervisor for Laravel Queue
Tags: php, laravel, queue, tutorial
Published: 2023-09-29 14:52:41

> Introduction

In this post im using ubuntu 22.04, read the installation step below 

> Installation

Begin by updating your package sources and installing Supervisor:

```
sudo apt update && sudo apt install supervisor
```

The supervisor service runs automatically after installation. You can check its status:

```
sudo systemctl status supervisor
```

You should receive the following output:

```
Output
● supervisor.service - Supervisor process control system for UNIX
     Loaded: loaded (/lib/systemd/system/supervisor.service; enabled; vendor preset: enabled)
     Active: active (running) since Wed 2021-11-17 22:56:48 UTC; 5min ago
```

> Add configuration

create `app.rupadana.com.conf` configuration to `/etc/supervisor/conf.d`, and paste it

```
[program:rupadana-app]
process_name=%(program_name)s_%(process_num)02d
command=php /home/rupadana-app/htdocs/app.rupadana.com/artisan queue:work --sleep=3 --tries=3
autostart=true
autorestart=true
stopasgroup=true
killasgroup=true
user=rupadana-app
numprocs=2
redirect_stderr=true
stdout_logfile = /home/app/htdocs/app.rupadana.com/worker.log
stopwaitsecs=3600
```

and enter this command to run configuration

```
sudo supervisorctl reread
sudo supervisorctl update
```
Hide filamentphp default Widget
Tags: php, laravel, filamentphp, learning
Published: 2023-09-29 14:51:23

> Introduction

Before continuing, make sure you have installed panel builder.

```bash
php artisan filament:install --panels
```


> Edit AdminPanelProvider

Edit file `app/Providers/Filament/AdminPanelProvider.php`

Here we found default widgets, you can remove it.
```php
$panel
->widgets([
    Widgets\AccountWidget::class,
    Widgets\FilamentInfoWidget::class,
])
```

Open `/admin` and widget is gone.
Rails debugging
Published: 2023-09-29 14:51:01

_Fear Ye Not the Red Screen of Better Errors_

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j40uv4e3wtn9hy5bia4z.png)
- `Missing template N`  
  -- note controller#action render view's name, and check `views` for misspelled folder/file names, or missing view
- `No route matches`
  -- compare `routes.rb` name to controller route name
  -- check form route exists in `routes.rb`
  -- check form route name
- `param is missing or the value is empty: PARAM_NAME`
  -- match the view form element's `name` to the controller `fetch.params` name
- `undefined local variable or method NAME`
  -- could be a local view var or method that is missing, but usually missed the `@` for an instance variable that is defined in the controller#action
- `uninitialized constant SOMEController`
  -- mispelled/non-matching controller name in `routes.rb` and the actual filename `controllers\NAME_controller.rb`
- `class/module name must be CONSTANT for controller`
  -- probably not CamelCase controller name in controller file
- always check logic, from math calcs to conditionals
- if a view does not display a value, probably missing the `=` in `<%= %>`
- be sure form text, elements, attributes match perfectly to spec, read more each test failure message and/or the actual test file
- `label` && `/ROUTE displays NAME entered when the form is submitted` errors: match html labels `for` with the corresponding element `id`, *these errors cascade to numerous other errors, disappointing at first but a giant relief when corrected
Optimizing Next.js Performance with Code Splitting and Dynamic Imports
Tags: javascript, nextjs, tutorial, webdev
Published: 2023-09-29 14:50:17

Code splitting is a technique that allows you to split your JavaScript bundle into smaller, more manageable chunks, which can improve the performance of your Next.js application. Here's an example of how to use code splitting in Next.js:

Let's assume you have a Next.js project with the following directory structure:

```
- pages
  - index.js
  - about.js
```

You can use dynamic imports to split your code into smaller chunks. In this example, we'll split the code for the about page:

```js
// pages/about.js

import { useEffect, useState } from 'react';

// Import the dynamic module using the import() function
const DynamicComponent = dynamic(() => import('../components/DynamicComponent'), {
  loading: () => <p>Loading...</p>, // Optional loading component
  ssr: false, // Set ssr to false to enable client-side rendering
});

function About() {
  const [showDynamicComponent, setShowDynamicComponent] = useState(false);

  useEffect(() => {
    // When the component mounts, set showDynamicComponent to true
    setShowDynamicComponent(true);
  }, []);

  return (
    <div>
      <h1>About Page</h1>
      {showDynamicComponent && <DynamicComponent />}
    </div>
  );
}

export default About;
```

In this example, we're using the dynamic function from the next/dynamic module to load the DynamicComponent dynamically. We provide an optional loading component (<p>Loading...</p>) that is displayed while the dynamic component is being loaded.

The ssr: false option specifies that this component should only be rendered on the client side, which is often desired for code-split components.

Now, let's create the DynamicComponent component that will be dynamically loaded:

```js
// components/DynamicComponent.js

function DynamicComponent() {
  return <p>This component was dynamically loaded.</p>;
}

export default DynamicComponent;
```

With this setup, the code for the DynamicComponent will be loaded only when the About page is accessed. This can help reduce the initial bundle size and improve the initial loading time of your application.

Remember to run npm install next/dynamic to install the next/dynamic module before using it in your code.
JavaScript Scope
Published: 2023-09-29 14:48:32

JavaScript is still used widely in programming for better or for worse and scope in javaScript is super important. Imagine scope as a way of organizing your room and keeping track of everything you store away. If you put things in all different cabinets and shelves how will you ever find things and make good use of them? It will probably be very hard for you to keep track of everything that way, and it can be very frustrating. 

So what is scope in javaScript? Scope sets boundaries of where and when you can use variables and functions you have created and it's functionality will depend on that.

There are two main types of scope:

Global scope: When you have a global scope is like placing something in your living room. Anyone in the room can see it and touch it because you made it accessible to everyone. In code this would translate to giving multiple functions that global variable to use and manipulate because its available to use anywhere in your code.

Local scope: When you create a local scope you can think of it as every room in your house is a function, and in those rooms you add a specific item  that is unique to that room. Other rooms would not have access to those unique item's, they can't see them or touch them, therefor they are local to that specific room. In code its the same, when you place a variable inside a function, only that function will have access to that variable.

In conclusion scope is very important in JavaScrript, it will determine how you organize your code and ultimately how your code runs or doesn't run.
depsdev v0.0.5🥳
Published: 2023-09-29 14:38:45

Just released depsdev v0.0.5 🥳

CLI client (and Golang module) for deps.dev API. Free access to dependencies, licenses, advisories, and other critical health and security signals for open source package versions.

https://github.com/edoardottt/depsdev

#security #github #opensource #blueteam #npm #pypi #nuget #maven
Seeking Guidance on Gaining Real-Time Java Experience as a Beginner
Tags: programming, coding, developers, beginners
Published: 2023-09-29 14:22:51

Hello fellow developers,

I hope this post finds you all well. I am writing as a passionate beginner in the world of Java development, eager to learn and grow in this field. I have recently embarked on my journey to become a proficient Java developer, but I'm facing a common challenge that many newcomers encounter – the daunting job market requirements.

I've noticed that many companies offering entry-level Java positions often demand 3 or more years of experience. As someone with no professional experience in the field, this presents a significant obstacle. I believe that real-world experience is crucial for personal and professional growth, and I am determined to find ways to gain practical experience in Java development.

This is where I turn to you, the experienced Java developers in this community. I'm seeking advice, insights, and suggestions on how I can bridge the gap between being a beginner and landing those entry-level positions that seem out of reach due to their experience requirements.

Here are some specific questions I have in mind:

- How can I acquire practical experience in Java development when I don't meet the experience requirements for entry-level jobs?
- Are there any open-source projects, volunteer opportunities,  that I can pursue to gain real-time experience?
- What online resources, courses, or certifications would you recommend for someone looking to bolster their Java skills and make themselves more marketable to employers?
- Is networking and reaching out to professionals in the field a viable way to break into the industry? If so, how can I effectively approach this?
- Are there any non-conventional paths to gaining Java experience that you or others you know have successfully taken?

Thank you for taking the time to read this post, and I look forward to learning from your experiences and expertise. Your contributions will not only benefit me but also other aspiring developers who may be facing similar hurdles.

Best Regards,
Harsha.
Solved my first Hard Difficulty LC Problem, Yay!
Tags: programming, dsa, javascript, python
Published: 2023-09-29 14:21:43

1 week before, one of my seniors told me to work on hash table problems more since they are always relevant in interviews and practical day-to-day coding. So, I did. I just avoided looking at hard problems like my life depended on it. After doing a 20-ish mix of easy and medium problems, I found the minimum subarray problem.

So, I attempted my first Hard difficulty problem on leetcode, and I am afraid to say that it felt like they dumbed it down for a hard difficulty. I'm not sure how I feel about it. One look at the problem told me what steps I needed to take. After doing 10 easy and medium problems on subarrays, the familiarity of the pattern felt good.

It's not to say that I didn't need help from the hints; I did, but when I discussed it with a senior, he approved of my thinking process but gave a bit more hints on some edge cases.

I was almost there but merging the sliding window algorithm and hashmap DS was a bit tricky (for a newbie!). I gobbled up a messy solution, and it worked. Below is the solution after I tweaked it a bit.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1g7lrf81xw55ron78wp4.JPG)

To calm my nerves, I then attempted to reverse a linked list. Then, I went back and re-implemented the solution using Python (my less-used language) to see if I wasn't just regurgitating the syntax from the pattern.
<=60s - JavaScript
Tags: webdev, javascript
Published: 2023-09-29 13:59:36

## Introduction:
In the fast-paced world of web development, every second counts. JavaScript, the backbone of modern web applications, has evolved to keep up with the need for rapid, efficient coding. This article explores the magic of JavaScript in 60 seconds or less, revealing why it's a must-know language for developers on the go.

## Syntax:
Declare variables with "let" or "const," create functions with ease, and manipulate the DOM effortlessly. Here's a quick example:
```javascript
const greet = (name) => {
  return `Hello, ${name}!`;
};

console.log(greet("John"));
```

## Why JavaScript:
JavaScript's speed stems from its versatility. It runs in browsers, on servers (Node.js), and powers mobile apps (React Native). Its asynchronous nature ensures smooth user experiences, making it the go-to choice for responsive web development. Plus, libraries like jQuery and frameworks like React turbocharge development even further.

## Conclusion:
In under 60 seconds, JavaScript empowers developers to craft dynamic, interactive web experiences. Its straightforward syntax and diverse applications make it a key tool in the developer's arsenal. So, whether you're building a website, a mobile app, or a server-side application, JavaScript's rapid capabilities will have you coding at the speed of light.
Property 'get' does not exist on type '() => AxiosCacheInstance'.
Tags: react, typescript, axios
Published: 2023-09-29 13:57:15

Hello,
New to typescript/react and looking for help with specifically this error and in general anything else that isn't right.

I have an axios api client called api-client.ts

```
//import axios, {CanceledError} from "axios";
import { default as axios } from 'axios'
import { setupCache } from 'axios-cache-interceptor';
import { 	ReasonPhrases, StatusCodes, getReasonPhrase, getStatusCode, } from 'http-status-codes';
import { useNavigate } from "react-router-dom";

function apiClient() {

  const axiosInstance = axios.create({
    withCredentials: true,
    baseURL: "https://localhost:44372/api/v1/",
    headers: {
      "Content-type": "application/json"
    },
    timeout: 60 * 1000 // 1 minute.
    //disabled this to implement react-error-boundary (https://www.npmjs.com/package/react-error-boundary)
    /* ,
    validateStatus: function (status) {
      return status < StatusCodes.INTERNAL_SERVER_ERROR; //this allows axios to not treat status as error codes https://axios-http.com/docs/handling_errors
    } */
  });

  const navigate = useNavigate();

  axiosInstance.interceptors.response.use(
    (response) => {
      //debugger;
      return response;
    },
    (error) => {
      //debugger;
      switch (error.response.status) {
        case 401:
          // Handle Unauthorized calls here
          // Display an alert
          break;
        case 403:
          // Handle Unauthorized calls here
          // Display an alert
          //alert('403 Unauthorized');
          navigate("/status/404");
          break;
        case 500:
          // Handle 500 here
          // redirect
          break;
        // and so on..
      }

      if (error.response.status == 400) {
      }
      return Promise.reject(error);
    }
  );

  const apiClientCached = setupCache(axiosInstance);

  return apiClientCached;

}

export default apiClient;
```



and i am importing this into my services as such (auth-service.ts)

```
//import {apiClientOld} from "./api-client-old";
import apiClient from "./api-client";

class AuthService {

      getLoggedInUser() {
        return apiClient.get(`/Authorization/GetLoggedInUser`);
      }

      getLoggedInUserRoles() {
        return apiClient.get(`/Authorization/GetSecurityAttributesAsync`);
      } 

      testAuthorized() {
        return apiClient.get('/Authorization/TestAuthorized');
      }

      testUnauthorized() {
        return apiClient.get('/Authorization/TestUnauthorized');
      }
}

export default new AuthService();
```

the problem i am trying to solve is why the .get is throwing this exception

```
Property 'get' does not exist on type '() => AxiosCacheInstance'.
```


Thank you in advance
Musikly! Updated!
Tags: webdev, showdev, opensource, react
Published: 2023-09-29 13:39:07

Howdy Folks!

This is a continuation of the Musikly CLI, but this time featuring a UI :))

It plays songs/audio from offline files stored on your computer. In future versions ytdl will be integrated into the app, enabling seamless downloads for mp4 files. 

It's not totally complete, but the basic functionality has been completed!

Tech Stack:
- HTML
- CSS
- React.js
- Rust (Tauri specifically)

I'd be glad to see people contribute!!

Thanks

![Preview of Musikly](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z9htm2kofp8vofpd6d4a.png)

[Link to Musikly](https://github.com/Liftoff-Studios/Musikly)