Forem: Sakib Ahmed

Dive into Open Source: A Guide to Hacktoberfest 2023

Sakib Ahmed — Fri, 13 Oct 2023 11:12:24 +0000

Introduction:

Hey, tech enthusiasts! Are you ready for the most exciting month in the world of open source? Hacktoberfest is back and buzzing with energy for its 2023 edition! It's that time of the year when developers, designers, and tech aficionados from around the globe come together to contribute to open source projects. In this post, we'll explore what Hacktoberfest is, how you can participate, and why this annual event is so special for the tech community. Let's embark on this open source journey and make a meaningful impact!

What is Hacktoberfest?

Hacktoberfest is an annual celebration of open source software, organized by DigitalOcean in partnership with GitHub. It's a month-long event during October, where contributors are encouraged to make at least four high-quality pull requests to open source projects. It's a fantastic way to give back to the community, improve your skills, and get some cool swag in return!

How to Participate:

Sign Up:

Create an account on the Hacktoberfest website (hacktoberfest.digitalocean.com) to officially register for the event. This is where you'll be able to track your progress throughout the month.

Find Projects:

Explore the Hacktoberfest website or GitHub to discover open source projects you'd like to contribute to. Look for issues labeled as "Hacktoberfest" or "good first issue" to find beginner-friendly tasks.

Fork and Clone:

Fork the repository of the project you want to contribute to. Clone your forked repository to your local machine.

Make Contributions:

Work on the issues, fix bugs, add features, improve documentation, or whatever the project requires. Ensure your contributions meet the project's guidelines.

Create Pull Requests:

Submit pull requests to the original repository. Describe your changes, and if the project maintainers are satisfied, your pull requests will be merged!

Track Progress:

Check your progress on the Hacktoberfest website as you complete your contributions. Remember, you need to make at least four valid pull requests to complete the challenge.

Why Hacktoberfest Matters:

Hacktoberfest is more than just a challenge—it's a celebration of collaboration, innovation, and learning. By participating, you're contributing to the open-source ecosystem and helping make software better for everyone. It's an opportunity to learn from experienced developers, gain exposure to diverse projects, and develop skills that will shape your tech journey.

Conclusion:

Join the global community in celebrating Hacktoberfest 2023! Let's come together, learn, grow, and contribute to the open source world. Make your mark, have fun, and let's create a lasting impact on the software development landscape. Happy Hacking!

hacktoberfest2023 #hacktoberfest23

How to solve Vercel and Netlify "Page Not Found" after page refresh [SOLVED]

Sakib Ahmed — Mon, 27 Feb 2023 16:25:12 +0000

Worst Worst Worst. What?

You obviously deployed your React App in vercel or netlify right? If you are using react-router then you must face the shitty Page Not Found page.

Netlify not found page

Why this page shows us when we don't like it? Huh, there are a simple reason for this. When you use a React Router in your application and navigate to another page and reload your site, it give as "Page Not Found". Even, your 404 page doesn't work. Am I right? Let me know in the comment below.

How to solve this?

To fix this error whenever you are either trying to access your app or you're on other routes, you have to set up a redirect and rewrite rules for your react-router application. The redirect rule will help your application avoid "Page Not Found".

I will show you both in vercel and netlify. 1 shot 2 Kill.

For NETLIFY

Add a _redirects file in your public folder. In my case, I'm using react + vite. I added _redirects file in the public folder.

now copy paste this code to _redirects file.
/* /index.html 200

Boom, done.

For VERCEL

Create a file named vercel.json in the root folder of your project.

now again copy paste.



{
    "rewrites": [
        {
            "source": "/(.*)",
            "destination": "/"
        }
    ]
}

Boom, done x2

result?

My 404 page working😵

after navigating to another page and refresh, my website working

Hey, we manage to throw vercel and netlify "Page Not Found", show some support🤗

Web Development Internship at Oasis Infobyte: A Learning Journey

Sakib Ahmed — Mon, 13 Feb 2023 18:25:02 +0000

As a web development enthusiast, I was excited to embark on a journey of learning and growth with Oasis Infobyte, a leading web development company. I was fortunate enough to secure a month-long internship in February and it turned out to be a fantastic experience. I was able to complete 3 tasks of level 2 and hone my skills in web development.

The team at Oasis Infobyte was incredibly supportive and provided me with opportunities to work on real-life projects. This gave me a hands-on experience of how web development works in the real world. I was amazed at the level of professionalism and expertise the team had in their respective fields. I was able to learn a great deal from my colleagues and was amazed by how willing they were to share their knowledge and experiences with me.

One of the highlights of my internship was being able to work on various projects and tasks. I was able to apply the knowledge and skills I had acquired and develop my abilities further. I was particularly proud of completing 3 tasks of level 2 and contributing to the overall success of the projects I worked on.

The training I received at Oasis Infobyte was unparalleled. I was introduced to various technologies, tools that are used in web development. I was able to learn about front-end development and more. The knowledge and skills I acquired during my internship have been invaluable and will help me in my future endeavors.

In conclusion, my web development internship at Oasis Infobyte was an unforgettable experience. I am grateful for the opportunity to work with such a fantastic team and learn from some of the best in the field. I would highly recommend Oasis Infobyte to anyone looking to start or advance their web development career. For more information, visit their website at oasisinfobyte.com.

You can also connect with me on Githuband Twitter to keep up with my web development journey and follow my future endeavors. Beside I have

Thank you for the opportunity to share my experience and I look forward to the next chapter in my web development journey.

Git & GitHub Common Error

Sakib Ahmed — Sun, 22 Jan 2023 09:16:38 +0000

GitHub ERROR SOLVE - GES

GES stands for GitHub Error Solve. This is an Open Source project dedicated to resolving any errors or issues that may arise while using GitHub. Our primary objective is to empower individuals to feel comfortable and confident using the platform by providing comprehensive solutions to common problems.

This website was created to help newbie users who want to use GitHub and git with joy but don't want to face the same error or issues. Here I added all the common errors you may face while using Git and GitHub. Feel free to check it out. Hope this website will help.

Tech Stack:

React, Vite, Tailwind

If you want to work on this project, you are very welcome.

Find your problem here by typing the error:

Live: https://github-error-solve.vercel.app
Repo: https://github.com/devvsakib/github-error-solve

A HTTPRequest article by generated by ChatGPT!

Sakib Ahmed — Mon, 26 Dec 2022 12:34:53 +0000

This http request article generated by ChatGPT!

HTTP (Hypertext Transfer Protocol) is a protocol that is used for communication between a client and a server on the World Wide Web. It allows clients (e.g. a web browser) to send requests to servers (e.g. a web server) and receive responses in return.

There are several different types of HTTP requests that can be made, including GET, POST, PUT, DELETE, and others. Each type of request serves a different purpose and is used in different scenarios.

Here is a brief overview of the most common types of HTTP requests:

GET: A GET request is used to retrieve information from a server. It is the most common type of request and is used to retrieve a webpage or other resource.
POST: A POST request is used to send data to a server for processing. It is typically used when a user submits a form or uploads a file.
PUT: A PUT request is used to update an existing resource on the server.
DELETE: A DELETE request is used to delete a resource from the server.

To make an HTTP request in JavaScript, you can use the XMLHttpRequest object or the fetch() function.

Here is an example of an HTTP GET request using XMLHttpRequest:

// Create an instance of the XMLHttpRequest object
var xhr = new XMLHttpRequest();

// Set the request method, URL, and other options
xhr.open('GET', 'http://www.example.com/somefile.txt', true);

// Send the request
xhr.send();

And here is an example of an HTTP GET request using fetch():

// Send the request
fetch('http://www.example.com/somefile.txt')
  .then(function(response) {
    // Handle the response
  });

These examples demonstrate how to make a simple GET request, but you can use other request methods (e.g. POST, PUT, DELETE) by setting the open() method's third argument accordingly.

HTTP requests are an essential part of web development and are used to retrieve and send data between clients and servers. Whether you are using XMLHttpRequest or fetch(), understanding how to make HTTP requests is an important skill for any frontend developer.

Finish here ------------

So, this one just a small blog. You can even create script for your video, generate any type of blog! Besides, If you worked with WordPress, you surely know what is plugin. Fact is, you also able to create plugin with chatGPT and you dont even need to write a single line of code. Sound wired?

If you feel lonely, chat with chatGPT.

State vs Props in reactjs

Sakib Ahmed — Sat, 03 Dec 2022 15:36:40 +0000

What is State?

The state is an update-able structure that is used to contain data or information about the component and can change over time. The change in state can happen as a response to user action or system event. It is the heart of the react component which determines the behavior of the component and how it will render. A state must be kept as simple as possible. It represents the component's local state or information. it can only be accessed or modified inside the component or by the component directly.

What is Props?

Props are read-only component. It is an object which stores the value of attributes of a tag and work similar to the HTML attributes. It allows passing data from one component to other components. It is similar to function arguments and can be passed to the component the same way as arguments passed in a function. Props are immutable so we cannot modify the props from inside the component.

Dissimilarity between State and Props

1.
State: State changes can be asynchronous.
Props: Props are read-only.

2.
State: State is mutable.
Props: Props are immutable.

3.
State: State holds information about the components.
Props: Props allow you to pass data from one components to other components as an argument.

4.
State: State can be used for rendering dynamic changes with the component.
Props: Props used to communicate between components.

5.
State: State cannot be accessed by child components.
Props: Props can be accessed by child components.

6.
State: The state is internal and controlled by the React Component itself.
Props: Props are external and controlled by what ever renders the component.

7.
State: State cannot make components reusable.
Props: Props make components reusable.

Below table will guide you about the changing in props and state.

NO	Condition	State	Props
1.	Can get initial value from parent component?	Yes	Yes
2.	Can be changed by parent Component?	No	Yes
3.	Can set default values inside component?	Yes	Yes
4.	Can change inside component?	Yes	No
5.	Can set initial value for child component?	Yes	Yes
6.	Can change in child component?	Yes	No

And last but not least, The component state and props share some common similarities.

NO	State and Props
1.	Both are plain JavaScript Object.
2.	Both can contain default values.
3.	Both are read-only when they are using this.

See yaaa.

devvsakib

What is SCOPE in JavaScript?

Sakib Ahmed — Tue, 29 Nov 2022 18:39:19 +0000

It's all about accessing variable. The accessibility or validity of a variable is determined by it's SCOPE.
Suppose a variable is declared inside a function. And you try to access the variable outside that function.
Then you will encounter an error that the variable is not defined.

Ex:

But Why?
Because the scope of that variable is limited to that function and you can't access that.

Scope type

There are two types of scope in javascript.

Local Scope
Global Scope

What is Local Scope.

Whenever a variable is declared inside a function it is said to have local scope.

A variable declared inside a function can only be used inside that function. We can't access it outside the function

What is Global Scope.

The variable which can be accessed everywhere are said to have global scope. These variable are not declared inside any function.

A global variable can be accessed by any function.
Here, we assigned value of a variable which is outside the function.

In the above snippet, we have a variable globalScope whose scope is not limited to any function and thus can be accessed everywhere, even within a function

You are done, but wait...

There are something call Hoisting.

Hoisting

In JavaScript, all variable declarations are moved to the top of their scope. This is known is hoisting.

In JavaScript, a variable can be used before it is declared! wait what? yes, read it right.

I mean that:

var newVar = 10;
...
...

...
...
var newVar = 10;

Will result the same output, because all the variable are automatically moved to top when we run the program.

This concept is known as hoisting.

Conclusion

A scope of a variable is the block where it can be accessed and used.

If a variable is declared inside a function it is known as a local variable.
If a variable is declared globally, it is said to have a global scope.

Hoisting is a JavaScript's behaviour of moving variable declarations to the top.

See yaa...

Tips: Array destructuring in javascript ES6

Sakib Ahmed — Mon, 28 Nov 2022 17:48:43 +0000

The following invokes the getScore() function and assigns the returned value to a variable.

const scores = getScore()

To get the invidual score, you need to do like this:

const x = scores[0],
    y = scores[1],
    z = scores[2];

Prior to ES6, there was no direct way to assign the elements of the array to multiple variables such as x, y and z.

But in ES6, you can use the destructing assignment as follow:

const [x, y, z] = getScore()

console.log(x) // 10
console.log(y) // 20
console.log(z) // 30

The variable x, y and z will take the values of the first second third elements of the array.

*Note that the square brackets [ ] look like the array syntax but they are not.

If array return two elements, the third varible z will be undefined

function getScore() {
    return [10, 20]
}

const [x, y, z] = getScore()

console.log(x) // 10
console.log(y) // 20
console.log(z) // undefined

But if array has more than three element, the remaining elements are discarded. Example:

function getScore() {
    return [10, 20, 30, 40, 50]
}

const [x, y, z] = getScore()

console.log(x) // 10
console.log(y) // 20
console.log(z) // 30

But there are a cool way to catch them ;)

Array Destructuring Assigment and REST syntax

It's possible to take all remaining elements of an array and put them in a new array bu using the rest syntax (...):

function getScore() {
    return [10, 20, 30, 40, 50]
}

const [x, y, z, ...args] = getScore()

console.log(x) // 10
console.log(y) // 20
console.log(z) // 30
console.log(args) // [40, 50]

Remember, rest return a new array with remaining elements.

Note: it's possible to destructure an array in the assingment that separates from the variable's declaration. For example:

const [x, y ]= [10, 20]

console.log(x) // 10
console.log(y) // 20

Intro to JS array destructuring

Suppose, you have a function that returns an array of numbers as follows:

Nested array destructuring

The following function returns an array that contains an element or nested array.

const getProfile = () => {
    return [
        'John',
        'Doe',
        ['Red','Blue', 'Green']
    ]
}

Since the third element of the returned array is another array, you have to use the nested array destructuring suntax to destructure it, like this:

const [name1, name2, [color1, color2, color3]] = getProfile()

console.log(color1, color2, color3);
//output: Red Blue Green

Array Destructuring Assignment Applications

Let's see some practical examples of using the array destructuring assignments syntax.

Swapping variables

The array destructuring make it easy to swap values of variables without using a temporary variable:

const x = 10,
    y = 20;

[x, y] = [y, x]


console.log(x) // 20
console.log(y) // 10

Functions that return multiple values

In JavaScript, a function can return a value. However, you can return an array that contains multiple values.

const state = (x, y) => {
    return [
        x + y,
        (x * y) / 2
    ]
}

And then you use the array destructuring assignment syntax to destructure the elements of the return array into variables:

const [ sum, average ] = state()

console.log(sum) // 30
console.log(average) // 15

So? Did you learned? If you enjoyed and learned something please let me know. See yaa

Tips: Object Destructuring in JavaScript ES6

Sakib Ahmed — Sun, 27 Nov 2022 19:05:04 +0000

Suppose you have a person object with TWO prperties:

let person = {
   firstName: 'Devv',
   lastName: 'Sakib'
}

Before ES6, when you want to assign the variables to the properties of the person object, you typically do like this:

let firstName = person.firstName
let lastName = person.lastName

But but but, ES6 make it more easier! There are an alternative way to assign properties of an object. Let's see

let { firstName: fName, lastName: lName } = person

Here, firstName and lastName prop are assgined to fName and lName variables.

Syntax:

let { 
    property: variable, 
    property: variable 
    } = object

Notice that the property name is always on the left whether it is object literal or object destructuring syntax.

TO KNOW: If the variables have the same name as the properies of the object, you can make the code more concise as follows:

let { firstName, lastName } = person

console.log(firstName) // "Sakib"
console.log(lastName) // "Smith"

In this examples, we declared two variables firstName and lastName, and assigned the properties of the object to the variables in the same statement.

When you assign a property that does not exist to a variable using the object destructuring, the variable is set to undefined.

Example:

let { firstName, lastName, middleName } = person

console.log(firstName) // "Sakib"
console.log(lastName) // "Smith"
console.log(middleName) // undefined

The middleName property does not exist in the person object, that's why middleName is undefined

Default Values

You are able to assign a default value of the variable when the property of an object doesn't exist.

Example:

let person = {
   firstName: 'Devv',
   lastName: 'Sakib'
}

let { 
    firstName, 
    lastName, 
    middleName = ''
    } = person

console.log(middleName) // ''

In this example, we assigned empty string to the middleName variable when the person object doesn't have the middleName property.

However, when the person object has middleName property, the assignment works as usual:

Example:

let person = {
   firstName: 'Devv',
   lastName: 'Sakib',
   middleName: 'IDK'
}

let { 
    firstName, 
    lastName, 
    middleName = ''
    } = person

console.log(middleName) // 'IDK'

Destructuring a null object

If you know, a function may return an object or null in some case.

const person = () => {
   return null
}

let { fname } = person()

But you can't destructure an null object. The code will throw a TypeError

TypeError: Cannot destructure property 'fname' of 'person()' as it is null.

To solve this, you can use the OR(||) operator to fallback the null object t an empty object.

let { fname } = person() || {}

Now, fname will be undefined

There are so many destructuring, will write later. See yaa

forEach() or map() ? When to use?

Sakib Ahmed — Fri, 30 Sep 2022 05:17:14 +0000

In this article we'll discuss about forEach and map method in javascript. Which one best and when to use each one.

In JavaScript, forEach and map are two of the most popular methods to work with arrays. Primarily both use to iterate array. So this make a little bit confusion which one we should use.

`forEach` Method:

forEach is used to run a function on each element without changing the array. Note, forEach method doesn’t return anything, if you try to get the return value of the forEach method, you will get undefined. Since it allows you to modify the source array itself, it’s a mutator method.

Code Example:

// given array
let arr = [1, 2, 3, 4, 5];

//output the square of each number
let returnVal= arr.forEach(num => 
  console.log(`${num} x ${num} = ${num * num}`)
);

//the array hasn't changed
console.log(arr); 
console.log(returnVal);

// Output
// 1 x 1 = 1
// 2 x 2 = 4
// 3 x 3 = 9
// 4 x 4 = 16
// 5 x 5 = 25
// [1,2,3,4,5]
// undefined

forEach not returning any new array. The return value of this method is ignored, and the original array doesn't change. The return value of forEach is always undefined.

`map` Method

Similar to forEach method but return NEW ARRAY. It's create new array with return value, but forEach give us undefined. But map doesn't change the given array, so we can say that it’s an immutable method.

Code example:

// given array
let arr = [1, 2, 3, 4, 5];

//output the square of each number
let returnVal= arr.map((num) => num * num)

//the array hasn't changed
console.log(arr); 
console.log(returnVal);

// Output
 [1,2,3,4,5]
 [1,4,9,16,25]

So, as you see, map method return a new array with the returning value but doesn't change the given array. Given array remains unchanged

So what is the differences between forEach and map?

As I said, map returns a new array but forEach return nothing. So, the main difference between map and forEach is that the map method returns a new array by applying the callback function on each element of an array, while the forEach method doesn’t return anything.
forEach method can be use to mutate the source array. Instead, it's great for when you need to do some action with each element of the array.

Which one to use?

If you’re planning to alter the array elements by applying a function, you should use the map method, since it doesn’t modify the original array and returns a new array. In this way, the original array is kept intact. On the other hand, if you want to loop through all the elements of an array and don’t need a returned array, use the forEach method.

How to star a coding YouTube Channel. Step by Step

Sakib Ahmed — Tue, 27 Sep 2022 18:12:58 +0000

Most of us want to start a YouTube channel. But they don't know where to start. To i will walk you through the process from absolute beginners.

First:
Before creating YouTube channel, we need some tool. For voice recording you need an good quality microphone or you can use your headphone mic or use your Mobile for voice recording. Then you need screen recorder.

Channel Name Selection

I always recommend using your name as your youtube channel name. It's help you to find you all over the network. Using your name as a channel name can help to better associate you with your content.

Create YouTube Logo and Brand Icon

After selecting your YouTube channel name, you need to create your channel Logo and Brand icon you see use in video as video watermark, when you click, it's say SUBSCRIBEEEE. Don't forget to create COVER too.

Create YouTube channel as Brand Channel

Create the account for your YouTube channel and create your channel as a Brand Account. This allows you to keep some separation between your personal Google account and your software YouTube channel.

Create Your Goals For your YouTube Channel

First you need to decide what is your goal for your channel.
For example, helping other, give you some reason to learn, why people will watch your video, making money through YouTube ad revenue, sponsorships, and affiliate links

When thinking about your channel and the videos you want to make, don’t worry if you want to create a video about a topic that someone else has already done. There are a lot of potential viewers in the world, and there are probably some people that can learn best from your unique style.

Your Intro

I hope you know what i mean bu Your Intro. Basically, every youtuber has their own intro. An intro is exactly what it sounds like, a introductory video that tells the viewer everything they need to know about your product/service and business while also setting the tone for your brand and the rest of your content. Do not jump for " Hello everyone welcome to my youtube channel" bla bla... Instead of this, you can say "Hey I'm Your Host X". So, create your intro right now...

Content type for your YouTube Channel

The most important of this article and your youtube channel is what type of tutorial video you are making. Content type mean, there are ton of content type like gaming, funny, music video etc. So you want to create a coding youtube channel, then you have to make your content only coding related. It doesn't mean you are uploading gaming video and coding video on your channel, that's make sense right. Do not break your rule, stick with it. Keep uploading video. Never stop

Only Loser stop after start

For example channels:
CodeWithHarry
WebDevSimplified
Freecodecamp

YouTube video Scripting

Do not start recording without script. Write a script, no need to write whole script. Just write some major point of your video you must need. And describe them very clearly. Most of people do the same mistake, they start recording and stuck in video while talking and that's make so unprofessional. Write script, use your secondary screen or mobile or write on paper, You will see an outstanding output.

Screen Recording Tips

If you are showing code on screen, make it as large as possible. Why? So basically, when we watch tutorial on YouTube when we see small font size, most of people watch tutorial on MOBILE so it's make sense to use large font right? It's an important issue to keep in your mind while writing code you need to make it as large as possible.

Video edit

You don't need high level video editing software to edit your video. I will suggest you to use Filmora, Camtasia or if you are familiar with Adobe Premiere Pro. And i definitely don't suggest Premiere pro for beginners. Make sure your AUDIO and Video are exactly matched if you recorded your audio video with different software.

Choose a Title for your YouTube video

For most types of videos, it's best to pick a title that people are searching for. There are two main ways to find what people are searching for: YouTube search autocomplete and Google Trends. Take a look at YouTube Search. Type your main keyword and see what's next word showing. Make sure you are using Private window or Incognito Mode

For example:
type "javascript"

Video THUMBNAIL

The most important, A great custom video thumbnail can make all the difference when it comes to a viewer clicking through to your video. A good thumbnail makes you want to watch the video. A bad thumbnail or no thumbnail does not make a good impression. SO take your enough time to make thumbnaillllllllllllllll. After finishing thumbnail, ask your self will click my video if i use this thumbnail? If yes, Then you are good to go.

Uplaod your video in time

Always try to upload your video in same time.

I just wanted to give you a simple beginners guide to start your Coding YouTube Channel . I hope this article will help you to start your channel. Do not quite, Stay Stay Stay. Give your best, you will definitely see the result

For more, visit DevvSakib

Fetch API in JavaScript

Sakib Ahmed — Sun, 25 Sep 2022 10:41:08 +0000

Basic Fetch request

fetch(url)
.then(response=> response.json())
.then(data => console.log(data));

This is how to fetch in javascript. Very simple!

Wait not done yet.

The Fetch API provides a JavaScript interface for accessing and manipulating parts of the protocol, such as requests and responses. Before fetch(), we used XHR (XMLHttpRequest). Using Fetch is very easy. Fetch() starts the process of fetching a resource from a server and returns Promise that resolves to a Response object.
So we dont need XMLHttpRequest anymore. But yeah, we need xhr for ajax.

But how XMLHttpRequest is look like? how to write ?
Lets see:

// Create an XMLHttpRequest object
const xhttp = new XMLHttpRequest();

// Define a callback function
xhttp.onload = function() {
  // Here you can use the Data
}

// Send a request
xhttp.open("GET", "ajax_info.txt");
xhttp.send();

fetch()

fetch('http://example.com/movies.json')
  .then((response) => response.json())
  .then((data) => console.log(data));

Here we are fetching a JSON file from our desire server and printing it to the console. The simplest use of fetch() takes one argument — the path to the resource you want to fetch — and does not directly return the JSON response body but instead returns a promise that resolves with a Response object.

The Response object, in turn, does not directly contain the actual JSON response body but is instead a representation of the entire HTTP response. So, to extract the JSON body content from the Response object, we use the json() method, which returns a second promise that resolves with the result of parsing the response body text as JSON.

Real Example:

Fetch url: https://my-json-server.typicode.com/typicode/demo/posts

fetch('https://my-json-server.typicode.com/typicode/demo/posts')
  .then((response) => response.json())
  .then((data) => console.log(data[0].id));
// output: 1

Go to the link. We are fetching json from this url.

for more example, check my codepen code FETCH "BRAKING BAD" CHARACTER

Forem: Sakib Ahmed

Dive into Open Source: A Guide to Hacktoberfest 2023

Introduction:

What is Hacktoberfest?

How to Participate:

Sign Up:

Find Projects:

Fork and Clone:

Make Contributions:

Create Pull Requests:

Track Progress:

Why Hacktoberfest Matters:

Conclusion:

hacktoberfest2023 #hacktoberfest23

How to solve Vercel and Netlify "Page Not Found" after page refresh [SOLVED]

How to solve this?

For NETLIFY

For VERCEL

result?

Web Development Internship at Oasis Infobyte: A Learning Journey

Git & GitHub Common Error

GitHub ERROR SOLVE - GES

A HTTPRequest article by generated by ChatGPT!

State vs Props in reactjs

What is State?

What is Props?

Dissimilarity between State and Props

What is SCOPE in JavaScript?

Scope type

What is Local Scope.

What is Global Scope.

Hoisting

Conclusion

Tips: Array destructuring in javascript ES6

Array Destructuring Assigment and REST syntax

Intro to JS array destructuring

Nested array destructuring

Array Destructuring Assignment Applications

Tips: Object Destructuring in JavaScript ES6

Default Values

Destructuring a null object

forEach() or map() ? When to use?

forEach Method:

map Method

So what is the differences between forEach and map?

Which one to use?

How to star a coding YouTube Channel. Step by Step

Channel Name Selection

Create YouTube Logo and Brand Icon

Create YouTube channel as Brand Channel

Create Your Goals For your YouTube Channel

Your Intro

Content type for your YouTube Channel

YouTube video Scripting

Screen Recording Tips

Video edit

Choose a Title for your YouTube video

Video THUMBNAIL

Uplaod your video in time

Fetch API in JavaScript

fetch()

Real Example:

`forEach` Method:

`map` Method