teleren/devto huggingface dataset:
Need to have VSCode settings for a Next.js project
Tags: nextjs, webdev, vscode, beginners
Published: 2024-07-04 14:03:22

Do you find it difficult to navigate your NextJS project or do you get lost when you are editing multiple pages/routes/layouts/components at once? Look no further!

## Custom Labels
VSCode supports custom labels for the files that are currently being displayed. I have put together some labels that work amazingly with a typical NextJS project setup.
```json
"workbench.editor.customLabels.patterns": {
  "**/app/**/layout.tsx": "${dirname(1)}/${dirname} - Layout",
  "**/app/**/page.tsx": "${dirname(1)}/${dirname} - Page",
  "**/app/**/route.ts": "${dirname(1)}/${dirname} - Route",
  "**/app/**/_components/**/*.tsx": "${filename} - ${dirname(2)}/${dirname(1)} - Component",
  "**/components/**/*.tsx": "${filename} - Component",
  "**/data-layer/**/*.ts": "${filename} - Data Layer",
  "**/entities/**/*.ts": "${filename} - Entity",
  "**/hooks/**/*.ts": "${filename} - Hook",
  "**/lib/**/*.ts": "${filename} - Library",
  "**/utils/**/*.ts": "${filename} - Utility",
  "**/env/**/*.ts": "${filename} - Environment"
}
```
You can always modify it to match your project needs!

To correctly setup the settings for your project create a directory called `.vscode` with a `settings.json` file inside of it. Then simply add your settings in there and it will apply for everyone in the project that uses VSCode.

## NextJS TypeScript Version
Do not forget to set your TypeScript version to the one provided by NextJS. You can do so by opening the command palette in VSCode by pressing `CTRL + SHIFT + P` or `F1` and then entering `>TypeScript: Select TypeScript Version...` after you have done so you want to select `Use Workspace Version`.

This will also add:
```json
"typescript.tsdk": "node_modules\\typescript\\lib"
```
to `settings.json` in the `.vscode` directory of your project.

## Result
![Result](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ss6kjjw53zpzmi22z9tt.png)

You can easily identify what file belongs to what directory and therefore you for example do not have multiple "page.tsx" that you have to guess which one is correct.
Petite historique du langage Java
Tags: webdev, java, beginners, programming
Published: 2024-07-04 13:50:49

EN 1991, des ingénieurs de `Sun Microsystems`, regroupés en une équipe appelée `équipe verte` composée de:

- James Gosling
- Mike Sheridan
- Patrick Naughton

décident de créer Java mais, sous forme d'un projet nommé "Oak" mais celui-ci fut un échec.
Par la suite Bill Joy ( cofondateur de la firme `Sun Microsystems`) propose une nouvelle version appelée `Java`

1. Pourquoi?:
Les ingénieurs cherchaient a concevoir un langage applicable à des petits appareils électriques ( on parle là de `code embarqué`).

2. Procédé:
Ils se sont basés sur une syntaxe proche du langage C++, en reprenant le concept de la machine virtuelle déjà exploité auparavant par le Pascal UCSD.

3. Idée:
L'idée consistait d'abord à traduire un programme source, non pas directement en langage machine mais, dans un pseudo langage universel disposant des fonctionnalités communes à toutes les machines ( notion de `portabilité`).

Ce code intermédiaire, appelé `bytecode`, se trouve ainsi compact et portable sur n'importe quelle machine, à condition que celle-ci dispose d'un programme approprié (machine virtuelle) permettant de l'interpréter dans un langage compréhensible par la machine concernée.


## Définitions de mots clés:

1. **Sun Microsystems**:
Était un constructeur d'ordinateurs et éditeur de logiciels américain, racheté par Oracle Corporation le `20 Avril 2009` pour 7,4 milliards de dollars.

2. **Notion de portabilité**:
La portabilité d'un langage de programmation signifie que le code écrit dans ce langage peut être exécuté sur différentes plateformes et architectures sans nécessiter de modifications majeures.
C'est un aspect essentiel des langages de haut niveau comme le C, Java ou Python qui permettent aux développeurs de créer des applications multiplateformes plus facilement.

3. **Bytecode**:
Le bytecode est une représentation intermédiaire d'un programme source, souvent générée par des langages de programmation comme Java ou Python.
Contrairement au code source écrit par le développeur, le bytecode n'est pas directement exécutable par le processeur de l'ordinateur. 
Il est plutôt destiné à être exécuté par une **machine virtuelle** (VM), telle que la Java Virtual Machine (JVM) pour Java ou la Python Virtual Machine (PVM) pour Python.

## Quelques points supplémentaires pour l'exactitude historique et la clarté :

- Java a été officiellement lancé par Sun Microsystems en 1995.
- Oak a été renommé Java en raison d'un conflit de nom avec une autre technologie existante.
- Java a été conçu avec la philosophie "**_write once, run anywhere_**" (écrire une fois, exécuter partout).
Unable to get the emails from outlook using this method (using graph api)
Published: 2024-07-04 13:44:15

	/// <summary>
	/// Initializes a new instance of <see cref="Office365MailServiceClient"/>.
	/// </summary>
	/// <param name="connectionParams">Connection string as a key value pair.</param>
	public Office365MailServiceClient(Dictionary<string, string> connectionParams)
	{
		this.graphAuthenticatorV1 = new MSGraphAuthenticator(connectionParams, MSGraphAuthenticator.GraphAPIVersion.v1);
		this.graphClientV1 = this.graphAuthenticatorV1.GetAuthenticatedClient();
	}

          private GraphServiceClient graphClientV1;

	/// <summary>
	/// Gets the mail folder name by id.
	/// </summary>
	/// <param name="parentFolderId">Parent Folder Id.</param>
	/// <returns></returns>
	public string GetMailFolderNameById(string parentFolderId)
	 => graphClientV1.Me.MailFolders[parentFolderId].Request().GetAsync().Result?.DisplayName ?? string.Empty;
	 
    
    public List<Message> GetAllMails()
    {
        List<Message> mails = new List<Message>();
        //var result = graphClientV1.Me.Messages.Request().GetAsync();
        //IUserMessagesCollectionPage currentPage = result.Result;
        IUserMessagesCollectionPage currentPage =  graphClientV1.Me.Messages.Request().GetAsync().Result;
        while (currentPage != null)
        {
            foreach (var mail in currentPage)
            {
                try
                {
                    mails.Add(mail);
                }
                catch (Exception) { }
            }
            currentPage = (currentPage.NextPageRequest != null) ? currentPage.NextPageRequest.GetAsync().Result : null;
        }
        return mails;
    }
    
    getting this error:
    
       at System.Threading.Tasks.Task.ThrowIfExceptional(Boolean includeTaskCanceledExceptions)


    can anyone help me to get resolve this method?
    -Thanks in advance.
Fetching and Displaying Code Snippets Using Server Actions, Prisma and MongoDB & Syntax Highlighting
Tags: webdev, nextjs, prisma, javascript
Published: 2024-07-04 13:43:28

Welcome back to our Code Snippet Sharing App series! In this video, we focus on fetching code snippets and displaying them with syntax highlighting using NextJS. We'll explore cache revalidating, fetching a list of snippets from the database using Prisma ORM and server actions, and fetching individual snippet details by ID.

In this video, you’ll learn:
- How to implement cache revalidation for efficient data fetching
- Fetching a list of snippets from the database using Prisma ORM and server actions
- Fetching individual snippet details by snippet ID
- Integrating code syntax highlighting for better readability
- Creating reusable components for displaying snippets in multiple places

{%youtube nBFXznvoKdo %}

By the end of this tutorial, you'll be able to fetch and display code snippets with syntax highlighting, making your app more dynamic and user-friendly. This is a key feature for our Code Snippet Sharing App, enhancing the overall user experience.

If you haven't already, be sure to check out the previous videos in this series where we set up authentication, integrated a VS Code-like editor, and created code snippets. Stay tuned for more exciting features coming up!

🔗 Link to Previous Video: https://www.youtube.com/watch?v=YemuQVs5yEk
🔗 Link to Series Playlist: https://www.youtube.com/watch?v=vjFLoXvcIOk&list=PLtUG3cTN2la1V5wV1nz1LnZ6lf8ECsBE1

Don’t forget to like, comment, and subscribe for more updates. Hit the notification bell so you never miss a new video in this series!
Interview with Simon Hyll, a Tauri Maintainer
Tags: rust, tauri, opensource, maintainer
Published: 2024-07-04 13:17:39

Welcome to the second episode of our new series “Tauri Maintainers”, where we chat with [Tauri](https://tauri.app/) maintainers.

In this episode, [Eleftheria](https://twitter.com/BatsouElef) discusses with [Simon Hyll](https://twitter.com/simonhyll):

* How he started
    
* Time management between a full-time job and contributing to Tauri
    
* Decision-making process in Tauri
    
* How to start contributing to any open-source
    
* And more!
    

Check out the [video](https://youtu.be/t_fjmOGfvbA):

{% embed https://youtu.be/t_fjmOGfvbA %}

## Find Out More 🔗

* Find Simon on [LinkedIn](https://www.linkedin.com/in/simonhyll/) and [X](https://twitter.com/simonhyll)
    
* Join [Tauri](https://discord.gg/TMeDqHPa)’s and [CrabNebula](https://discord.gg/7U2Ed9AnuQ)’s discord servers
    

**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_
Как работает GPS? Секреты технологии, которую мы все используем!
Tags: learning, discuss
Published: 2024-07-04 13:17:23

Да, у нас всех есть GPS, но давайте разберемся, как оно на самом деле работает!

GPS, или глобальная система позиционирования, представляет собой сеть спутников, кружащихся вокруг Земли на орбите. Эти спутники постоянно передают сигналы, содержащие точное время и информацию о своем местоположении. Вот как оно работает:

1. Триангуляция: Ваш GPS-приемник получает сигналы от нескольких спутников одновременно. Зная точное время, которое затрачивается на доставку сигналов от каждого спутника, устройство может определить расстояние до каждого из них.

2. Вычисление координат: Используя полученные расстояния до нескольких спутников, GPS-приемник вычисляет свои трехмерные координаты (широту, долготу и высоту) с высокой точностью.

3. Коррекция сигналов: Внешние факторы, такие как атмосферные условия и геометрия спутников, могут искажать сигналы. Чтобы улучшить точность, GPS-приемники могут использовать коррекционные данные, предоставляемые специализированными службами.

Таким образом, GPS позволяет нам определять свое местоположение с высокой точностью в любой точке планеты. Эта технология имеет широкий спектр применения, от навигации на дорогах до мониторинга мобильных ресурсов и научных исследований.

Теперь вы знаете больше о том, как работает GPS! Делись этим знанием с друзьями и оставляй свои вопросы в комментариях!

[GPS Mobile Solutions
](https://gps-tracking.kz)
Building an AI-Powered Interview Preparation Platform: A Developer's Journey🔥
Tags: interview, ai, openai, career
Published: 2024-07-04 13:10:36

Hey DEV Community! 👋 I'm excited to share a project I've been working on: an AI-powered interview preparation platform. This tool helps users practice for job interviews using AI-generated feedback. Here's an overview of the project and some technical insights.



![PrepMasterAI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7s6ipyhgztr3ydhtohuo.gif)



## Project Overview
The platform allows users to:

- Answer mock interview questions via voice or text input
- Receive AI-generated feedback on their responses
- Get a detailed analysis of their strengths and areas for improvement

## Tech Stack

1. Frontend: Nextjs with Javascript

2. AI Model: Google Gemini AI model for interview analysis

3. Speech-to-Text: react-hook-speech-to-text NPM package used for voice to text 


## Key Challenges and Solutions

_Accurate Speech Recognition_

1. Implemented noise cancellation and used the Web Speech API for better accuracy
Added a text editor for users to correct any transcription errors


_Real-time AI Analysis_

2. Used web workers to run the AI model in the background, ensuring a responsive UI
Implemented a queue system to handle multiple requests efficiently


_Personalized Question Selection_

3. Developed an algorithm to dynamically select questions based on user performance and job role


_Data Privacy_

4. Implemented end-to-end encryption for voice data
Used tokenization to anonymize user data for AI training

Link of the Platform: [PrepMasterAI](https://prepmasterai.vercel.app)

I'd love to hear your thoughts, suggestions, or questions about the project. Have you worked on similar AI-powered tools? What challenges did you face?

Let's discuss in the comments!
Boost Your Brand with a Top Social Media Marketing Agency in Pune
Tags: socialmediamarketing, socialmediaagency, socialmediapune, socialmedia
Published: 2024-07-04 13:08:57

In today's digital world, social media marketing is essential for businesses to connect with their audience and build a strong online presence. Partnering with a top social media marketing agency in Pune can help you achieve these goals efficiently. Here’s how, supported by a real-life success story.
The Importance of Social Media Marketing
Social media marketing involves creating and sharing content on platforms like Facebook, Instagram, Twitter, and LinkedIn to engage with your audience and promote your brand. A professional social media agency Pune can develop targeted strategies to enhance your brand’s visibility and engagement.
Case Study: Revamping a Local Café’s Online Presence
A local café in Pune struggled to attract customers through its social media channels. They decided to work with a leading social media marketing agency in Pune. The agency conducted an audit of their social media profiles and created a tailored strategy that included visually appealing posts, engaging stories, and targeted ads.
Within three months, the café’s followers increased by 150%, and their in-store visits and online orders saw a significant boost. This success story highlights how effective social media marketing can transform a business.
Benefits of Partnering with a [Social Media Marketing Agency](https://tinyurl.com/ukilikuu)
Expert Knowledge: These agencies have teams of experts who understand the latest trends and best practices in social media marketing.
Customized Strategies: They offer tailored social media plans that align with your business goals and target audience.
Time-Saving: Managing social media accounts can be time-consuming. An agency handles this for you, allowing you to focus on your core business.
Measurable Results: Social media agencies provide detailed analytics to track the performance of your campaigns.
Increased Engagement: Effective social media strategies lead to higher engagement rates, helping you build a loyal customer base.
Conclusion
Partnering with a social media marketing agency in Pune can significantly boost your brand’s online presence and drive growth. With expert strategies and effective execution, your business can achieve greater visibility, increased engagement, and improved customer loyalty.
NEXTDNS, Do not Recomend
Tags: nextdns, mdns, secure, dns
Published: 2024-07-04 12:58:51

I do not recommend NextDNS any longer. I know my previous article did, but at the time of this writing I have found them to be adversarial in the quest for a better internet. They can just block you at will. If they decide they don't want you going to a site, they just block it. They are working together with other organizations and they also complete these attacks which is the main reason you are supposed to use them. **It's become asinine.**
Revamped Mock-API.net: Simplifying API Mocking for Developers
Tags: webdev, api, mocking, fake
Published: 2024-07-04 12:56:46

Hello Dev Community!

I'm excited to announce that we've recently revamped our landing page at [Mock-API.net](https://mock-api.net), and we can't wait for you to check it out! 🎉

**What is Mock-API.net?**

Mock-API.net is a powerful tool designed to make API mocking easy and efficient. Whether you're a frontend developer needing a quick API response or a backend developer testing your endpoints, our tool provides a seamless experience for all your mocking needs.

**What's New?**

1. **Enhanced User Experience**: We've reimagined the user interface to make navigation and usage as intuitive as possible. Our new design ensures you can get started quickly and find everything you need effortlessly.

2. **Quick API Creation**: Creating mock APIs has never been faster. With our revamped interface, you can set up and manage your mock APIs in just a few clicks.

3. **Improved Performance**: We’ve optimized the backend to provide faster response times and a more reliable service overall.

**Why Use Mock-API.net?**

- **Streamlined Development**: Focus on your application logic while we handle the mock API responses.
- **Efficient Testing**: Test your frontend without waiting for backend development to catch up.
- **Team Collaboration**: Easily share mock APIs with your team for consistent development environments.

We'd love for you to give it a try and let us know what you think. Your feedback is invaluable to us as we continue to improve the tool. Head over to [Mock-API.net](https://mock-api.net) and start mocking your APIs today!

Happy coding!
Setting Up Node.js and Creating a Basic HTTP Server: A Beginner's Guide
Tags: beginners, javascript, tutorial, webdev
Published: 2024-07-04 12:55:08

**Introduction**
In this guide, we will walk through the process of setting up Node.js on your machine and creating a basic HTTP server. Node.js is a powerful runtime environment that allows you to run JavaScript on the server side, making it ideal for building scalable and efficient web applications.
**Step 1: Installing Node.js**

`Download Node.js: `

Visit the [Node.js](https://nodejs.org/en) official website.

`Verify Installation:`

1. Open your terminal or command prompt.
2. Type `node -v` to check if `Node.js` is installed.

```
c:use\xyz\abc> node -v
v14.17.3
c:use\xyz\abc> npm -v
6.14.13

```

**Step 2: Building a Basic HTTP Server**
`server.js`

```
var http = require("http");

var server = http.createServer(function (req, res) {
  res.write("Hello It is a testing..!");
  res.end(); // End the response
});

server.listen(5050, () => {
  console.log("The Server is starting at 5050");
});

```

**Step 3: Running the Server**

```
c:use\xyz\abc\nodebackend>node server.js
The server is starting at 5050

```

**Step 4: Access the Server on browser**
1. Open a web browser or use a tool like Postman.
2. Type in the browser URL Box http://localhost:5050 in your browser.
3. You will see the response "Hello It is a testing..!" displayed in the browser.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ebncgx2fei8heaswge3.png)
3D Power - 3D Township Rendering Services
Tags: architecture, design, web, township
Published: 2024-07-04 12:47:42

Our team of experts provides you architectural services for Township with complete branding solution. It can be used to show that exactly how the building will look like without going in to the trouble and expense of constructing a physical model. By the same token, a home builder or developer can use these digital animations to showcase their homes to prospective buyers. 3D power visualization provides 3D views for your township project which helps you to visualize your dream project. We are experts in designing residential and commercial projects.

Contact us.

Phone :   +91 9372032805

Business Email : info@3dpower.in

Address :  61, New RH Colony, Amarpreet Square, Aurangabad, Maharashtra, 431001, India

Website :   [https://www.3dpower.in/township-design-rendering](https://www.3dpower.in/township-design-rendering)

Social media.

Facebook :  [https://www.facebook.com/threedpower](https://www.facebook.com/threedpower)

Youtube :   [https://www.youtube.com/@3dpowerwalkthrough](https://www.youtube.com/@3dpowerwalkthrough)

Linkedin :   [https://www.linkedin.com/in/3dpower/](https://www.linkedin.com/in/3dpower/)

Instagram :   [https://www.instagram.com/3dpower/](https://www.instagram.com/3dpower/)

Twitter :    [https://www.twitter.com/3DPower](https://www.twitter.com/3DPower)

Pinterest :  [https://in.pinterest.com/3dpower/](https://in.pinterest.com/3dpower/)

Working Hours :  Mon - Sat 10:00 AM To 07:00 PM ; Sunday : Closed
Rapid Innovation Joins ConsenSys Partner Program
Published: 2024-07-04 12:44:51

## Exciting New Partnership

Rapid Innovation is thrilled to announce its acceptance into the prestigious
ConsenSys Partner Program. ConsenSys, a leader in the blockchain industry,
provides top-notch Ethereum blockchain infrastructure and apps. This
partnership grants us access to unique features and opportunities via
ConsenSys’ blockchain products, including a generous set of APIs and
integration points for app and tool builders.

## Benefits for Our Clients

Being part of the ConsenSys Partner Program means we can offer even better
products to our clients. We will have access to ConsenSys tools like Quorum,
Codefi, Infura, Metamask, Diligence, and Truffle. This will streamline our
blockchain app production, allowing us to create high-performing, personalized
apps more efficiently.

## Integration Opportunities

ConsenSys provides numerous integration points that will help us build better
products. For instance, Quorum offers an open-source protocol layer that is
easy to integrate, while Codefi targets commerce and finance companies,
improving business actions and digitizing financial instruments.

## New Projects and Clients

Partnering with ConsenSys allows us to get involved in new projects and help
more companies. Our promise to our clients is to launch within 90 days or
less. With Rapid Innovation and ConsenSys, your app will leverage customer
insights, efficiently solving their needs and improving your service over
time.

## Other Opportunities

We are excited about the flexibility and opportunities this partnership
brings, including reselling ConsenSys products, early adoption privileges, and
constant support. This will help us create more efficient blockchain solutions
and grow alongside ConsenSys and our other partner companies.

## Looking Ahead

Our partnership with ConsenSys opens up new opportunities for all of us. We
share a common vision of empowering startups with accessible, user-friendly
solutions. Stay tuned for exciting updates as this relationship is just
beginning. We’re so glad you’re here for the start of it.

📣📣Drive innovation with intelligent AI and secure blockchain technology! Check
out how we can help your business grow!

[Blockchain App Development](https://www.rapidinnovation.io/service-
development/blockchain-app-development-company-in-usa)

[Blockchain App Development](https://www.rapidinnovation.io/service-
development/blockchain-app-development-company-in-usa)

[AI Software Development](https://www.rapidinnovation.io/ai-software-
development-company-in-usa)

[AI Software Development](https://www.rapidinnovation.io/ai-software-
development-company-in-usa)

## URLs

  * <https://www.rapidinnovation.io/post/rapid-innovation-is-proud-to-partner-with-consensys>

## Hashtags

#BlockchainInnovation

#EthereumDevelopment

#ConsenSysPartner

#RapidInnovation

#DecentralizedApps