teleren/devto huggingface dataset:
New update on Flotiq and Gatsby Starters
Tags: webdev, gatsby, headlesscms, lesscode
Published: 2023-01-04 11:41:57

You can use Flotiq to manage and update your content and use Gatsby to build and serve your website or app. This separation of concerns can make managing and maintaining your website or app easier over time. Check our new updated starters to version 5 of Gatbsy.

Flotiq is a headless content management system that allows developers to easily create, manage, and publish content using a simple and flexible API. Flotiq is designed to be easy to use and integrate with a variety of frameworks and tools, including static site generators like Gatsby. With Flotiq, you can create custom content models and fields and use the Flotiq API to access and manage your content. Flotiq also includes features like version history, user roles and permissions, and integrations with popular tools.

Gatsby version 5 was released in November 2022, and it includes a number of new features and improvements, including:

- Gatsby amplified the speed of Incremental Builds and Incremental Deploys by introducing the Slice API.
- Partial Hydration (Beta)
- Script Component
For more detailed updates you can read [on their blog](https://www.gatsbyjs.com/blog/gatsby-5/).
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fqww2bo011o08wwy74ga.png)

In Flotiq, we provide a number of starter templates and examples that you can use to quickly get started with Gatsby and Flotiq. Here are [a few examples](https://flotiq.com/starters/).

With the new version of Gatsby, we also updated our starters, so you can enjoy new features and improve your products with Flotiq.

Our starters include a pre-configured Gatsby project with the:
`gatsby-source-flotiq`
plugin installed and configured. You can use all four starters to quickly set up a blog, store, and portfolio website with Gatsby and Flotiq, with support for categories, tags, and featured images. You can find more information and the source code for many starters at our [GitHub profile](https://github.com/flotiq).

I hope this information was helpful! If you have any specific questions about using our starters or if you need further assistance, please don't hesitate to ask. We are here to help.
Beat the Stress and Meet Your Deadlines: Proven Strategies for Software Developers
Tags: beginners, javascript, react, career
Published: 2023-01-04 11:37:34

𝑫𝒆𝒂𝒅𝒍𝒊𝒏𝒆𝒔 𝒂𝒏𝒅 𝒑𝒓𝒐𝒋𝒆𝒄𝒕 𝒄𝒐𝒏𝒔𝒕𝒓𝒂𝒊𝒏𝒕𝒔 𝒂𝒓𝒆 𝒂𝒏 𝒊𝒏𝒆𝒗𝒊𝒕𝒂𝒃𝒍𝒆 𝒑𝒂𝒓𝒕 𝒐𝒇 𝒃𝒆𝒊𝒏𝒈 𝒂 𝒔𝒐𝒇𝒕𝒘𝒂𝒓𝒆 𝒆𝒏𝒈𝒊𝒏𝒆𝒆𝒓. 𝑯𝒐𝒘 𝒚𝒐𝒖 𝒉𝒂𝒏𝒅𝒍𝒆 𝒕𝒉𝒆𝒔𝒆 𝒄𝒉𝒂𝒍𝒍𝒆𝒏𝒈𝒆𝒔 𝒄𝒂𝒏 𝒔𝒑𝒆𝒂𝒌 𝒗𝒐𝒍𝒖𝒎𝒆𝒔 𝒂𝒃𝒐𝒖𝒕 𝒚𝒐𝒖𝒓 𝒄𝒐𝒎𝒑𝒆𝒕𝒆𝒏𝒄𝒚 𝒂𝒏𝒅 𝒅𝒆𝒅𝒊𝒄𝒂𝒕𝒊𝒐𝒏 𝒕𝒐 𝒅𝒆𝒍𝒊𝒗𝒆𝒓𝒊𝒏𝒈 𝒉𝒊𝒈𝒉-𝒒𝒖𝒂𝒍𝒊𝒕𝒚 𝒘𝒐𝒓𝒌.

A less experienced engineer may be overwhelmed by the pressure and struggle to handle the situation effectively, while an intermediate engineer may simply request more time without offering any other solutions.

On the other hand, a seasoned engineer will take a proactive approach and use their problem-solving skills to find creative solutions to the issue at hand. This may involve analyzing the root cause of the problem, identifying alternative approaches, and presenting a detailed proposal to the manager. This type of approach demonstrates a strong commitment to delivering high-quality work and a dedication to finding the best solution for the team.

Here are a few tips for avoiding stress when faced with unrealistic deadlines in software development:

𝑪𝒐𝒎𝒎𝒖𝒏𝒊𝒄𝒂𝒕𝒆 𝒆𝒂𝒓𝒍𝒚 𝒂𝒏𝒅 𝒐𝒇𝒕𝒆𝒏: If you see that a deadline is unrealistic, don't wait until the last minute to bring it up. Talk to your manager or team lead as soon as possible to discuss your concerns.

𝑶𝒇𝒇𝒆𝒓 𝒂𝒍𝒕𝒆𝒓𝒏𝒂𝒕𝒊𝒗𝒆 𝒔𝒐𝒍𝒖𝒕𝒊𝒐𝒏𝒔: Instead of simply stating that the deadline is unrealistic, come up with alternative approaches that could help you meet the deadline more easily. This could involve re-prioritizing tasks, seeking additional resources, or finding ways to streamline the development process.

𝑻𝒂𝒌𝒆 𝒃𝒓𝒆𝒂𝒌𝒔 𝒂𝒏𝒅 𝒑𝒓𝒂𝒄𝒕𝒊𝒄𝒆 𝒔𝒆𝒍𝒇-𝒄𝒂𝒓𝒆: It's important to take care of yourself both physically and mentally when facing stressful situations. Make sure to take breaks and engage in activities that help you relax and recharge.

𝑺𝒆𝒕 𝒓𝒆𝒂𝒍𝒊𝒔𝒕𝒊𝒄 𝒈𝒐𝒂𝒍𝒔: If you find that you are consistently being given unrealistic deadlines, it may be helpful to set your own goals and priorities. This can help you focus on the most important tasks and reduce your stress level.

𝑺𝒆𝒆𝒌 𝒔𝒖𝒑𝒑𝒐𝒓𝒕: Don't be afraid to reach out to your colleagues, manager, or a mentor for support and guidance. Having a supportive network can help you navigate stressful situations more effectively.

It's important for software engineers to have the ability to handle pressure and deadlines effectively. Don't let these challenges overwhelm you - use your skills and creativity to find solutions and succeed in your projects.
Fix: No QueryClient set, use QueryClientProvider to set one
Tags: javascript, react, nextjs
Published: 2023-01-04 11:28:05

I've been asked this 3 times now and it seems to be a common mistake when following the docs for React Query.

```Error: No QueryClient set, use QueryClientProvider to set one```

Probably the shortest post I'm going to make but just like Redux, React Query needs to provide the data to the entire app via a provider

```js
import { QueryClientProvider, QueryClient } from "react-query";

const queryClient = new QueryClient();

export default function App({ Component, pageProps }) {
  return (
    <QueryClientProvider client={queryClient}> // HERE!!!
      <Component {...pageProps} />
    </QueryClientProvider>
  );
}
```

Then from any component or page within your app, you can pull that data in and display it


```js
import { useQuery } from "react-query";

const { data, refetch } = useQuery("comments", fetchComments);
Here's a link to the getting started guide that might help.
```
[QueryClientProvider](https://tanstack.com/query/v4/docs/react/reference/QueryClientProvider)

[Remember to say thank you](https://mysmallstartup.com/30-ways-to-say-thank-you-for-supporting-my-small-business/)
How to create SharePoint List Items using MS Graph with PowerShell
Tags: sharepoint, powershell, graph
Published: 2023-01-04 11:27:42

I want to share with you my latest blog post:
[https://sposcripts.com/create-sharepoint-list-items-using-graph-api/](https://sposcripts.com/create-sharepoint-list-items-using-graph-api/)

How to create SharePoint List Items using MS Graph with PowerShell
How to upload files to SharePoint using Graph API (PowerShell)
Tags: powershell, microsoftgraph, automation, sharepoint
Published: 2023-01-04 11:25:26

Uploading files to SharePoint is a common use case, when we are integrating 3rd party systems with SharePoint. In this article, I want to show you how you can achieve to upload files to SharePoint using Graph API.

https://sposcripts.com/how-to-upload-files-to-sharepoint-using-graph-api/
I Created an OpenSource Portfolio Template for Developers 🚀
Tags: career, javascript, opensource, css
Published: 2023-01-04 11:00:00

**Launching** 🚀

## **Dopefolio** 🔥 - **An OpenSource Multipage Portfolio Website Template for Developers** 🚀

---

<div align="center">
  <img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9coge98bpo59p1crr6pc.gif" alt="Dopefolio Demo" width="100%" style="margin: 0;"/>
  <br>
</div>

## **Github Repo Link**: https://github.com/rammcodes/Dopefolio ⭐

---

Creating a **Portfolio Website** from scratch is time-consuming and that's why I have created an **OpenSource Portfolio Website Template for Developers** so developers don't have to build their website from scratch. 💯 

Instead, **Developers** can focus on building better **Projects** for their **Portfolio** without worrying about the **Portfolio** Website itself. 🤘

---

### **Features**:

- **Easy to Setup** ✅
- **Free to Use ( OpenSource )** ✅
- **No Additional Frameworks** ✅
- **No Additional Libraries** ✅
- **Multi Page** ✅
- **Fully Responsive** ✅
- **Super Fast and Optimized for SEO** ✅

<img src="https://i.ibb.co/1dD8Mky/Screenshot-from-2021-08-28-14-38-30.png" alt="Dopefolio Audits"  width="100%" style="margin: 0;" />

---



The project is made with **HTML, CSS**, some **JavaScript**, and **SASS** to write CSS. Don't worry if you don't know any, I have provided the instructions on how to use **Dopefolio** and set up your own Portfolio using it in the **README.md** file inside the Github Repository.


* Check out the **[Github Repository](https://github.com/rammcodes/Dopefolio)** 👨‍💻
* Drop a Github Star ⭐ 😉
* Fork the Repository 🍴
* Start using it for your own Portfolio 🙌

---

The **Demo Link** of the template is also provided in the **[Github Repository](https://github.com/rammcodes/Dopefolio)** along with the **Colors Playground** Link ✅

Hope this Portfolio Template will help you in your journey as a Developer 😇

---

## Important 😸

I regularly post useful content related to **Web Development and Programming** on **Linkedin** & **Youtube**. You should consider **Connecting with me or Following** me on **Linkedin**.

**Linkedin Profile**: https://linkedin.com/in/rammcodes

& Subscribe to my Youtube Channel

**Youtube**: https://youtube.com/@rammcodes

---

## Support 😇

I'm looking for a full-time/contract Job so if you got a good job opportunity that matches my skills and experience then feel free to contact me on my [website](https://rammaheshwari.com) or [linkedin](https://linkedin.com/in/rammcodes)

---

Do **Like** and **Share** this post 😇

Share your feedback by **Commenting** below 💬

Drop me a **Follow** for more **Awesome** content related to **Web Development** and **Programming** 🙌

#### **Thank you for your support** ❤️
10 important things that every developer should remember
Tags: webdev, beginners, programming, tutorial
Published: 2023-01-04 10:52:53

Here are 10 important things that every developer should remember:

1. Keep learning and improving: The field of software development is constantly evolving, and it is important for developers to keep learning and improving their skills in order to stay current and competitive.

2. Write clean and readable code: Well-written code is easier to understand, maintain, and debug, and it can save a lot of time and effort in the long run.

3. Test your code thoroughly: Testing is an essential part of the development process, and it is important to thoroughly test your code to ensure that it is reliable and bug-free.

4. Use version control: Version control systems such as Git allow developers to track changes to their code and collaborate with others, and they are an essential tool for any developer.

5. Follow coding standards and best practices: Adhering to coding standards and best practices helps to ensure that your code is consistent, efficient, and maintainable.

6. Collaborate with others: Collaboration is an important part of the software development process, and it is important to work well with others, communicate effectively, and share knowledge and ideas.

7. Understand the business goals and requirements: It is important for developers to understand the business goals and requirements for a project in order to create solutions that meet the needs of the business and the users.

8. Plan and prioritize tasks effectively: Good time management and task management skills are essential for developers to ensure that they are working on the most important tasks and meeting deadlines.

9. Stay up-to-date with the latest technologies: Keeping up with the latest technologies and trends in software development can help developers to stay current and improve their skills.

10. Take breaks and manage your time: It is important to take breaks and manage your time effectively in order to avoid burnout and maintain a healthy work-life balance.

Calling all techies and digital marketers! If you're looking for the latest trends, insights, and resources on software development and digital marketing, give my account a follow & share with your friends! I promise to keep things fresh, informative, and fun. 

[Subscribe to my LinkedIn Newsletter for more.](https://www.linkedin.com/pulse/10-important-things-every-developer-should-remember-mohit-chaprana)
Connect Your Node.js Project to MySQL Database Locally
Tags: node, javascript, mysql, webdev
Published: 2023-01-04 10:39:17

There is more than one way to connect MySQL database to node.js and in this tutorial, we are going use one of the easy ways to do it. With the use of XAMPP and mysql2 package, our connection will be set up in no time. No worries if you don't know these two, we are going to do this step by step.

## Install Xampp

Xampp is a control panel or cross-platform server that enables developers to create and test their programs locally. Xampp is going to provide the GUI(Graphical User Interface) of our database. It will allow us to create databases and the data we need for our project.

Visit the [apachefriends](https://www.apachefriends.org) website to download the suitable xampp for your operating system. Follow all the necessary procedures and install it. After the successful installation, open the program:

![Xampp control panel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nnp2kfd9w4zwoypb1tyi.png)

Start the first two modules on the panel(Apache and MySQL).


![Xampp control panel with apache and mysql started](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2oawmvdcgoli62pbon3m.png)

This will start the SQL database locally which you can access on a localhost server. Open your browser and go to `localhost/phpmyadmin/`. 


![phpmyadmin tab](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ndereu19p8ngpf17uv0r.png)

To create a new database, click on the **new** button at the side panel.


![create database](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9t9pdqq0h3z6bofeue4c.png)

Give your database a new name and click create. It should show up in the side panel after it has been successfully created. You can access it and go on to create your tables manually or import a SQL file with your data.

## Set Up Connection

For this, we will make use of the mysql2 package. Install mysql2 to your project with `npm install mysql2`. You should read the [mysql2 documentation](https://www.npmjs.com/package/mysql2?activeTab=readme) to learn more about how to work with the package.

In your model folder, create a **connection.js** file and copy the code to establish a connection to your database:

```
const mysql = require('mysql2');
const connection = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: '', //your password. You could leave it like this, for now
    database: 'database_name'
})

connection.connect((err)=>console.log(err || 'Database Connected'))

module.exports = connection.promise()
```

You can go on to import the **connection** function(please be aware that it is asynchronous) anywhere in your project you want to query your database. 

And that's it, our node.js project is connected to MySQL database in few steps.
Wednesday Links - Edition 2023-01-04
Tags: java, jvm, docker, git
Published: 2023-01-04 10:50:38

A collection of docker-compose files (30 sec)🚢
https://github.com/jonatan-ivanov/local-services/

Create a new Git branch with no history (1 min)🦥
https://joshlong.com/jl/blogpost/create-an-empty-git-branch.html

Is your Blocking Queue... Blocking? (3 min)
https://www.morling.dev/blog/is-your-blocking-queue-blocking/

Gazing into a crystal ball - my predictions for 2023 (6 min)🔮
https://mikemybytes.com/2022/12/30/gazing-into-a-crystal-ball-my-predictions-for-2023/
What is Dependency Injection
Tags: programming, android, mobile
Published: 2023-01-04 10:50:20

Dependency injection is a software design pattern that allows a system to be more flexible and modular by decoupling the implementation of objects from the objects that use them. It does this by allowing the objects that use other objects (called clients) to specify which objects they will use (called dependencies) at runtime, rather than having the clients create the dependencies themselves.

The key benefit of dependency injection is that it enables clients to specify their dependencies at runtime rather than hardcoding them. This makes it easier to change the implementation of a dependency without affecting the client, as well as making it easier to test the client in isolation.

There are several ways to implement dependency injection, including constructor injection, setter injection, and interface injection. In constructor injection, the dependencies are provided to the client via the constructor when the client is created. In setter injection, the dependencies are set on the client using setter methods. In interface injection, the dependencies are passed to the client through an interface implemented by the client.

Here's an example of constructor injection in Kotlin:

```
interface FileSystem {
    fun readFile(path: String): String
}

class RealFileSystem: FileSystem {
    override fun readFile(path: String): String {
        // implementation to read a file from the real file system goes here
    }
}

class MyClass(private val fileSystem: FileSystem) {
    fun doSomething() {
        val fileContents = fileSystem.readFile("/path/to/file.txt")
        // use the file contents to do something
    }
}

val fileSystem = RealFileSystem()
val myClass = MyClass(fileSystem)
myClass.doSomething()

```
In this example, MyClass has a dependency on FileSystem, which it needs to read a file. The FileSystem dependency is injected into MyClass via the constructor when MyClass is created. This allows MyClass to use any implementation of FileSystem without knowing how it is implemented.

It's also possible to use setter injection in Kotlin like this:

```
interface FileSystem {
    fun readFile(path: String): String
}

class RealFileSystem: FileSystem {
    override fun readFile(path: String): String {
        // implementation to read a file from the real file system goes here
    }
}

class MyClass {
    private lateinit var fileSystem: FileSystem
    
    fun setFileSystem(fileSystem: FileSystem) {
        this.fileSystem = fileSystem
    }
    
    fun doSomething() {
        val fileContents = fileSystem.readFile("/path/to/file.txt")
        // use the file contents to do something
    }
}

val fileSystem = RealFileSystem()
val myClass = MyClass()
myClass.setFileSystem(fileSystem)
myClass.doSomething()

```

Here, the fileSystem dependency is set on MyClass using the setFileSystem setter method.

Overall, dependency injection is a useful pattern for achieving loose coupling between objects, which can make a system more flexible and easier to maintain.
laravel token not validated for other jwt.auth
Tags: laravel, jwt
Published: 2023-01-04 10:49:05

I have issue with jwt.auth in Laravel Auth for API, token successfully generated by login but the bearer token not validated for other jwt.auth middleware.

[solved]
update .htaccess in "/public/.htaccess" and then add

```
<IfModule mod_rewrite.c>
    ...
    RewriteCond %{HTTP:Authorization} ^(.*)
    RewriteRule .* - [e=HTTP_AUTHORIZATION:%1]
</IfModule>


```
How to Get cheap Microsoft Office 2021
Tags: tutorial, microsoftcloud
Published: 2023-01-04 10:41:34

1. Sign up for Microsoft Office 365. Microsoft offers a range of subscription plans that include Office 365, which includes the latest version of Office 2021. Subscribing to Office 365 is the best and most cost-effective way to get Office 2021.

2. Look for discounts. There are often discounts available for Office 2021 at popular retailers like Amazon, Best Buy, and Walmart. Check these sites to see if you can find a good deal.

3. Buy a refurbished Office. Refurbished Office software can be a great way to get Office 2021 for a discounted price. Just make sure to buy from a reputable seller.

4. Buy an Office key card. Key cards are a great way to get Office 2021 without having to pay for the full version. These cards usually don’t include technical support, but they’re a great option if you’re on a budget.

5. Buy an Office subscription. If you need to use Office for a short period of time, you can purchase a subscription instead of buying the full version. This is a great way to save money while still getting access to Office 2021.

Get [Cheap Microsoft Office 2021 Pro Plus](https://mscdkeys.com/product/microsoft-office-2021-pro-plus-for-windows/)
Datepicker Bootstrap 5
Tags: bootstrap, datepicker, jquery, javascript
Published: 2023-01-04 10:18:06

## What is Bootstrap Datepicker?
Datepicker is a javascript component that adds the function of selecting date without the necessity of writing custom JavaScript code.

## Installation
We are going to use in this article installation via CDN. All installation methods are available on our [Downloads](https://gijgo.com/Download) page. In order to install bootstrap 5 datepicker you need to copy the latest css and javascript libraries from [jsdeliver](https://cdn.jsdelivr.net/npm/gijgo@latest/), [unpkg](https://unpkg.com/gijgo@latest/) or [cdnjs](https://cdnjs.com/libraries/gijgo).

```
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/gijgo@1.9.14/js/gijgo.min.js" type="text/javascript"></script>
<link href="https://cdn.jsdelivr.net/npm/gijgo@1.9.14/css/gijgo.min.css" rel="stylesheet" type="text/css" />
```

## Configuration

**Basic Example**
In our basic example we are going to show how to use our default bootstrap 5 configuration without any customizations.

```
<input id="datepicker" width="276" />
<script>
$('#datepicker').datepicker({ uiLibrary: 'bootstrap5' });
</script>
```

**Customization**
You can find all configuration options for the datepicker [here](https://gijgo.com/datepicker/configuration). In the example below you can see how to control the format of the date in the datepicker.

```
<input id="datepicker" value="2022-25-07" width="312" />
<script>
$('#datepicker').datepicker({ uiLibrary: 'bootstrap5', format: 'yyyy-dd-mm' });
</script>
```

**Localization**
Our datepicker support more than 15 languages and the list is growing. You can find the full list at our [locale](https://gijgo.com/datepicker/configuration/locale) configuration page.

```
<input id="datepicker" value="2022-25-07" width="312" />
<script>
$('#datepicker').datepicker({ uiLibrary: 'bootstrap5', locale: 'es-es' });
</script>
```

**Resources**

- [Bootstrap 5 Datepicker](https://gijgo.com/datepicker/example/bootstrap-5) example
- [Gijgo Datepicker](https://gijgo.com/datepicker) documentation page
- [Bootstrap 5](https://getbootstrap.com/docs/5.3/getting-started/introduction/) documentation page
Core Java - Data Types
Tags: java
Published: 2023-01-04 10:17:29

In java there are Primitive and Reference data types.

Primitive - byte, short, int, long, char, float, double, boolean.

Reference - Class, Array, String etc..

Byte - 1byte - (-128 to +127 range).
Short - 2byte - -32768 to 32767 range.
int - 4byte - -2^31 to 2^31-1
long - 8byte - -2^63 to 2^63-1
char - 2bytes
float - 4byte
double - 8byte

Type Casting --
Implicit - automatically type cast happens (lower -> higher)
Explicit - every time we need to type cast (higher -> lower).

Implicit

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



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