DEV Community: Ankita Sahu

Ever wondered why we usually write 'export deafult [component name]' to export a React Component?

Ankita Sahu — Mon, 11 Oct 2021 02:57:41 +0000

It's been quite some time that I've been wondersing the exact reason behind using export deafult [component name] to export a react component,but recently I know why?

When we export a component with default ,it in return helps us to import that component with any name in the .js file we want to use it.Still confused? Check out this example

For a Greet component write down the following code:

import React from 'react'

function Greet() {
    return (
        <div>
            <h1>Hello,Greetings!</h1>
        </div>
    )
}

export default Greet

In the App.js file

import './App.css';
import Greet from './Greet';

function App() {
  return (
    <div className="App">
      <Greet />
    </div>
  );
}

export default App;

These two snippets generate the following output:

now if we change the import name in app.js and the snippet now looks similar to this:

import './App.css';
import Greetings from './Greet';

function App() {
  return (
    <div className="App">
      <Greetings />
    </div>
  );
}

export default App;

The result is the same:

Named Exports

Here the Greet.js would look similar to this:

import React from 'react'

export const Greet = () => <h1>Hello,Greetings</h1>

And the App.js similar to this:

import './App.css';
import {Greet} from './Greet';

function App() {
  return (
    <div className="App">
      <Greet />
    </div>
  );
}

export default App;

In case of named components,we cannot change the name of the importing component on doing so it will generate an error,take a look at the App.js where we have changed the name in case of named components:

import './App.css';
import {Greetings} from './Greet';

function App() {
  return (
    <div className="App">
      <Greetings />
    </div>
  );
}

export default App;

also take a look at the error generated:

Probably now you know export takes a default and what could happen if you use named components.

My Let's Grow More Internship Journey!

Ankita Sahu — Fri, 23 Jul 2021 10:01:46 +0000

July 2021, maked the beginning of my internship journey with Let's Grow More.I still remember around one and a half month ago,I received an email on my inbox which had my offer letter ,thrilled to test and showcase my skills,I waited till the tasks arived.

Not much later our orientation program was conducted,we got to know what we had to do and that this was not going to be a simple I give you task,You submit the task and take the certificate internship,there was a lot more to add, the following javascript and many more technical sessions,were the much needed podcasts for many newbies!

My first task comprised of a static html,css and javascript webpage,it was pretty easy to complete this task within just a few hours,but what was important was,it was for the first time,I built an all feature website,starting from carousels,cards,newsletters,contact section,about me divs,and what not....It was as if I was putting all my necessary and learnt skills on a single webpage.This task is something I wouldn't miss mentioning on my resume because it shocases all my fundamental web dev skills.

Coming to task-2,this was somewhat interesting because it had to do with api and react,me being a newbie react developer and aproximately zero knowledge about apis,it was fun exploring the world of apis within a short time frame,to complete this task.

What I peculiarly liked about this entire internship was, the structure,it was picture perfectly designed from beginner,to intermidiate,and then the advanced level.

Well if any of you ever intend to go through my video submission or code snippets refer here:
1.Task-1 Code snippet
2.Task-2 Code snippet
3.Task-1 video link
4.Task-2 video link

And if you wish to onboard or get to know more about this internship head out to or to this.

A Two Steps Easy Discord Bot Creation

Ankita Sahu — Fri, 02 Jul 2021 07:48:31 +0000

Step 1: Create a Bot User
a) Sign into your discord account on https://discordapp.com and create a new application by heading to discord developers page. Then add a bot user to that application

b) Next save your bot's token for later use:
Save your bot's token

c) The last thing we need from this portal is your bot's invite URL. This determines what your bot has permission to do. At the very least it needs permission to send messages. Make sure to invite it to your server using that URL!
Get your bot's invite url.

Step 2: Head to Repl.it
If you haven't heard of it Repl.it is an online IDE of sorts that lets you create and share small projects. It's pretty amazing and has constantly been adding features to help you do more online. We call these repls.

a) Create a new repl named JavaScript .
Create a new Nodejs Repl

b) First thing we need to make sure a webserver is running in our repl. Repl.it will kill a running repl when you close the browser tab unless it's serving web content. Then Repl will keep it alive for an hour even if you close the tab. Paste the following code in your repl and Repl.it will automatically install packages for you and start an express webserver.

const express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => res.send('Hello World!'));

app.listen(port, () => console.log(`Example app listening at http://localhost:${port}`));

If you look to the left, a file called package.json should have appeared.
packagejson
This file holds any packages you require in your repl. Plus any other scripts we might make. Just like a regular NodeJs project.

I chose express as my webserver. If you're working with Python you'd probably use Flask, Ruby would have Sinatra. For java however I would recommend investigating com.sun.net.httpserver.HttpServer for a speedy start up time.

c) Next we need to instantiate our bot.

const express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => res.send('Hello World!'));

app.listen(port, () => console.log(`Example app listening at http://localhost:${port}`));

// ================= START BOT CODE ===================

const Discord = require('discord.js');
const client = new Discord.Client();

client.on('ready', () => {
  console.log(`Logged in as ${client.user.tag}!`);
});

client.on('message', msg => {
  if (msg.content === 'ping') {
    msg.reply('pong!');
  }
});

// You really don't want your token here since your repl's code
// is publically available. We'll take advantage of a Repl.it
// feature to hide the token we got earlier.
client.login(process.env.DISCORD_TOKEN);
ping pong is sort of like the hello world for bots. Once we start this up you should see your bot online in your server. If you send the word ping in your server the bot should reply with pong.

After you've pasted that code snippet in, don't click restart yet!

d) Create a .env file

On the left create a file called .env, the content of the file should be:

DISCORD_TOKEN=your_token

This will help us hide your token from the rest of the world. Read more about it here in Repl.it's Docs.

Now that the proper credentials are in, you can click restart now. Your bot should be online!
bot online
it alive boss

Congrats! You can peruse the discord.js documentation to implement all the cool bot features you can dream of!

2022 Hackathon Season

Ankita Sahu — Thu, 01 Jul 2021 06:21:11 +0000

MLH Init began on 27th June 2021,marking the start of the 2022 hackathon season.It has been super exciting till now,and I hope to attend and complete more and more challenges every day!

This time the new live challenges have been a great oppurtunity to give folks an exposure to newer fields.and the challenges have been really community centric annd fun.

Hoping to attend all the 2022 season hackathons by MLH because it's really worth learning and testing new skills.

Brainfuck, its as the name suggests!

Ankita Sahu — Fri, 02 Apr 2021 12:03:54 +0000

Brainfuck is an esoteric programming language created in 1993 by Urban Müller.

Notable for its extreme minimalism, the language consists of only eight simple commands and an instruction pointer. While it is fully Turing complete, it is not intended for practical use, but to challenge and amuse programmers. Brainfuck simply requires one to break commands into microscopic steps.

The language's name is a reference to the slang term brainfuck, which refers to things so complicated or unusual that they exceed the limits of one's understanding.

History
In 1992, Urban Müller, a Swiss physics student, took over a small online archive for Amiga software.[2] The archive grew more popular, and was soon mirrored around the world. Today, it is the world's largest Amiga archive, known as Aminet.

Müller designed Brainfuck with the goal of implementing it with the smallest possible compiler,[3] inspired by the 1024-byte compiler for the FALSE programming language.[4] Müller's original compiler was implemented in machine language and compiled to a binary with a size of 296 bytes. He uploaded the first Brainfuck compiler to Aminet in 1993. The program came with a "Readme" file, which briefly described the language, and challenged the reader "Who can program anything useful with it? :)". Müller also included an interpreter and some quite elaborate examples. A second version of the compiler used only 240 bytes.[5]

As Aminet grew, the compiler became popular among the Amiga community, and in time it was implemented for other platforms.

P′′: Brainfuck's formal "parent language"
Except for its two I/O commands, Brainfuck is a minor variation of the formal programming language P′′ created by Corrado Böhm in 1964, which in turn is explicitly based on the Turing machine. In fact, using six symbols equivalent to the respective Brainfuck commands +, -, <, >, [, ], Böhm provided an explicit program for each of the basic functions that together serve to compute any computable function. So the first "Brainfuck" programs appear in Böhm's 1964 paper – and they were programs sufficient to prove Turing completeness.

The Infinite Abacus: Brainfuck's "grand-parent" language
A version with explicit memory addressing rather without stack and a conditional jump was introduced by Joachim Lambek in 1961 under the name of the Infinite Abacus,[6] consisting of an infinite number of cells and two instructions:

X+ (increment cell X)
X- else jump T (decrement X if it is positive else jump to T)
He proves the Infinite Abacus can compute any computable recursive function by programming Kleene set of basic μ-recursive function.

His machine was simulated by Melzac's machine[7] modeling computation via arithmetic (rather than binary logic) mimicking a human operator moving pebbles on an abacus, hence the requirement that all numbers must be positive. Melzac, whose one instruction set computer is equivalent to an Infinite Abacus, gives programs for multiplication, gcd, nth prime number, representation in base b, sorting by magnitude, and shows how to simulate an arbitrary Turing machine.

Language design
The language consists of eight commands, listed below. A brainfuck program is a sequence of these commands, possibly interspersed with other characters (which are ignored). The commands are executed sequentially, with some exceptions: an instruction pointer begins at the first command, and each command it points to is executed, after which it normally moves forward to the next command. The program terminates when the instruction pointer moves past the last command.

The brainfuck language uses a simple machine model consisting of the program and instruction pointer, as well as a one-dimensional array of at least 30,000 byte cells initialized to zero; a movable data pointer (initialized to point to the leftmost byte of the array); and two streams of bytes for input and output (most often connected to a keyboard and a monitor respectively, and using the ASCII character encoding).

Commands
The eight language commands each consist of a single character:

Character Meaning

increment the data pointer (to point to the next cell to the right).
< decrement the data pointer (to point to the next cell to the left).

increment (increase by one) the byte at the data pointer.

decrement (decrease by one) the byte at the data pointer. . output the byte at the data pointer. , accept one byte of input, storing its value in the byte at the data pointer. [ if the byte at the data pointer is zero, then instead of moving the instruction pointer forward to the next command, jump it forward to the command after the matching ] command. ] if the byte at the data pointer is nonzero, then instead of moving the instruction pointer forward to the next command, jump it back to the command after the matching [ command.

Examples
Adding two values
As a first, simple example, the following code snippet will add the current cell's value to the next cell: Each time the loop is executed, the current cell is decremented, the data pointer moves to the right, that next cell is incremented, and the data pointer moves left again. This sequence is repeated until the starting cell is 0.

[->+<]
This can be incorporated into a simple addition program as follows:

++ Cell c0 = 2

+++++ Cell c1 = 5

[ Start your loops with your cell pointer on the loop counter (c1 in our case)
< + Add 1 to c0

Subtract 1 from c1 ] End your loops with the cell pointer on the loop counter

At this point our program has added 5 to 2 leaving 7 in c0 and 0 in c1
but we cannot output this value to the terminal since it is not ASCII encoded.

To display the ASCII character "7" we must add 48 to the value 7.
We use a loop to compute 48 = 6 * 8.

++++ ++++ c1 = 8 and this will be our loop counter again
[
< +++ +++ Add 6 to c0

Subtract 1 from c1 ] < . Print out c0 which has the value 55 which translates to "7"! Hello World! The following program prints "Hello World!" and a newline to the screen:

[ This program prints "Hello World!" and a newline to the screen, its
length is 106 active command characters. [It is not the shortest.]

This loop is an "initial comment loop", a simple way of adding a comment
to a BF program such that you don't have to worry about any command
characters. Any ".", ",", "+", "-", "<" and ">" characters are simply
ignored, the "[" and "]" characters just have to be balanced. This
loop and the commands it contains are ignored because the current cell
defaults to a value of 0; the 0 value causes this loop to be skipped.
]
++++++++ Set Cell #0 to 8
[
>++++ Add 4 to Cell #1; this will always set Cell #1 to 4
[ as the cell will be cleared by the loop
>++ Add 2 to Cell #2
>+++ Add 3 to Cell #3
>+++ Add 3 to Cell #4
>+ Add 1 to Cell #5
<<<<- Decrement the loop counter in Cell #1
] Loop till Cell #1 is zero; number of iterations is 4
>+ Add 1 to Cell #2
>+ Add 1 to Cell #3
>- Subtract 1 from Cell #4
>>+ Add 1 to Cell #6
[<] Move back to the first zero cell you find; this will
be Cell #1 which was cleared by the previous loop
<- Decrement the loop Counter in Cell #0
] Loop till Cell #0 is zero; number of iterations is 8

The result of this is:
Cell No : 0 1 2 3 4 5 6
Contents: 0 0 72 104 88 32 8
Pointer : ^

. Cell #2 has value 72 which is 'H'
---. Subtract 3 from Cell #3 to get 101 which is 'e'
+++++++..+++. Likewise for 'llo' from Cell #3
. Cell #5 is 32 for the space
<-. Subtract 1 from Cell #4 for 87 to give a 'W'
<. Cell #3 was set to 'o' from the end of 'Hello'
+++.------.--------. Cell #3 for 'rl' and 'd'
+. Add 1 to Cell #5 gives us an exclamation point
++. And finally a newline from Cell #6
For "readability", this code has been spread across many lines, and blanks and comments have been added. Brainfuck ignores all characters except the eight commands +-<>[],. so no special syntax for comments is needed (as long as the comments do not contain the command characters). The code could just as well have been written as:

++++++++[>++++[>++>+++>+++>+<<<<-]>+>+>->>+[<]<-]>>.>---.+++++++..+++.>>.<-.<.+++.------.--------.>>+.>++.
ROT13
This program enciphers its input with the ROT13 cipher. To do this, it must map characters A-M (ASCII 65-77) to N-Z (78-90), and vice versa. Also it must map a-m (97-109) to n-z (110-122) and vice versa. It must map all other characters to themselves; it reads characters one at a time and outputs their enciphered equivalents until it reads an EOF (here assumed to be represented as either -1 or "no change"), at which point the program terminates.

The basic approach used is as follows. Calling the input character x, divide x-1 by 32, keeping quotient and remainder. Unless the quotient is 2 or 3, just output x, having kept a copy of it during the division. If the quotient is 2 or 3, divide the remainder ((x-1) modulo 32) by 13; if the quotient here is 0, output x+13; if 1, output x-13; if 2, output x.

Regarding the division algorithm, when dividing y by z to get a quotient q and remainder r, there is an outer loop which sets q and r first to the quotient and remainder of 1/z, then to those of 2/z, and so on; after it has executed y times, this outer loop terminates, leaving q and r set to the quotient and remainder of y/z. (The dividend y is used as a diminishing counter that controls how many times this loop is executed.) Within the loop, there is code to increment r and decrement y, which is usually sufficient; however, every zth time through the outer loop, it is necessary to zero r and increment q. This is done with a diminishing counter set to the divisor z; each time through the outer loop, this counter is decremented, and when it reaches zero, it is refilled by moving the value from r back into it.

-,+[ Read first character and start outer character reading loop
-[ Skip forward if character is 0
>>++++[>++++++++<-] Set up divisor (32) for division loop
(MEMORY LAYOUT: dividend copy remainder divisor quotient zero zero)
<+<-[ Set up dividend (x minus 1) and enter division loop
>+>+>-[>>>] Increase copy and remainder / reduce divisor / Normal case: skip forward
<[[>+<-]>>+>] Special case: move remainder back to divisor and increase quotient
<<<<<- Decrement dividend
] End division loop
]>>>[-]+ End skip loop; zero former divisor and reuse space for a flag
>--[-[<->+++[-]]]<[ Zero that flag unless quotient was 2 or 3; zero quotient; check flag
++++++++++++<[ If flag then set up divisor (13) for second division loop
(MEMORY LAYOUT: zero copy dividend divisor remainder quotient zero zero)
>-[>+>>] Reduce divisor; Normal case: increase remainder
>[+[<+>-]>+>>] Special case: increase remainder / move it back to divisor / increase quotient
<<<<<- Decrease dividend
] End division loop
>>[<+>-] Add remainder back to divisor to get a useful 13
>[ Skip forward if quotient was 0
-[ Decrement quotient and skip forward if quotient was 1
-<<[-]>> Zero quotient and divisor if quotient was 2
]<<[<<->>-]>> Zero divisor and subtract 13 from copy if quotient was 1
]<<[<<+>>-] Zero divisor and add 13 to copy if quotient was 0
] End outer skip loop (jump to here if ((character minus 1)/32) was not 2 or 3)
<[-] Clear remainder from first division if second division was skipped
<.[-] Output ROT13ed character from copy and clear it
<-,+ Read next character
] End character reading loop
Portability issues
Partly because Urban Müller did not write a thorough language specification, the many subsequent brainfuck interpreters and compilers have come to use slightly different dialects of brainfuck.

Cell size
In the classic distribution, the cells are of 8-bit size (cells are bytes), and this is still the most common size. However, to read non-textual data, a brainfuck program may need to distinguish an end-of-file condition from any possible byte value; thus 16-bit cells have also been used. Some implementations have used 32-bit cells, 64-bit cells, or bignum cells with practically unlimited range, but programs that use this extra range are likely to be slow, since storing the value {\displaystyle n}n into a cell requires {\displaystyle O(n)}O(n) time as a cell's value may only be changed by incrementing and decrementing.

In all these variants, the , and . commands still read and write data in bytes. In most of them, the cells wrap around, i.e. incrementing a cell which holds its maximal value (with the + command) will bring it to its minimal value and vice versa. The exceptions are implementations which are distant from the underlying hardware, implementations that use bignums, and implementations that try to enforce portability.

It is usually easy to write brainfuck programs that do not ever cause integer wraparound or overflow, and therefore don't depend on cell size. Generally this means avoiding increment of +255 (unsigned 8-bit wraparound), or avoiding overstepping the boundaries of -128, +127 (since there are no comparison operators, a program cannot distinguish between a signed and unsigned two's complement fixed-bit-size cell and negativeness of numbers is a matter of interpretation). For more details on integer wraparound, see the Integer overflow article.

Array size
In the classic distribution, the array has 30,000 cells, and the pointer begins at the leftmost cell. Even more cells are needed to store things like the millionth Fibonacci number, and the easiest way to make the language Turing complete is to make the array unlimited on the right.

A few implementations[12] extend the array to the left as well; this is an uncommon feature, and therefore portable brainfuck programs do not depend on it.

When the pointer moves outside the bounds of the array, some implementations will give an error message, some will try to extend the array dynamically, some will not notice and will produce undefined behavior, and a few will move the pointer to the opposite end of the array. Some tradeoffs are involved: expanding the array dynamically to the right is the most user-friendly approach and is good for memory-hungry programs, but it carries a speed penalty. If a fixed-size array is used it is helpful to make it very large, or better yet let the user set the size. Giving an error message for bounds violations is very useful for debugging but even that carries a speed penalty unless it can be handled by the operating system's memory protections.

End-of-line code
Different operating systems (and sometimes different programming environments) use subtly different versions of ASCII. The most important difference is in the code used for the end of a line of text. MS-DOS and Microsoft Windows use a CRLF, i.e. a 13 followed by a 10, in most contexts. UNIX and its descendants (including GNU/Linux and Mac OS X) and Amigas use just 10, and older Macs use just 13. It would be difficult if brainfuck programs had to be rewritten for different operating systems. However, a unified standard was easy to create. Urban Müller's compiler and his example programs use 10, on both input and output; so do a large majority of existing brainfuck programs; and 10 is also more convenient to use than CRLF. Thus, brainfuck implementations should make sure that brainfuck programs that assume newline = 10 will run properly; many do so, but some do not.

This assumption is also consistent with most of the world's sample code for C and other languages, in that they use '\n', or 10, for their newlines. On systems that use CRLF line endings, the C standard library transparently remaps "\n" to "\r\n" on output and "\r\n" to "\n" on input for streams not opened in binary mode.

End-of-file behavior
The behavior of the , command when an end-of-file condition has been encountered varies. Some implementations set the cell at the pointer to 0, some set it to the C constant EOF (in practice this is usually -1), some leave the cell's value unchanged. There is no real consensus; arguments for the three behaviors are as follows.

Setting the cell to 0 avoids the use of negative numbers, and makes it marginally more concise to write a loop that reads characters until EOF occurs. This is a language extension devised by Panu Kalliokoski.

Setting the cell to -1 allows EOF to be distinguished from any byte value (if the cells are larger than bytes), which is necessary for reading non-textual data; also, it is the behavior of the C translation of , given in Müller's readme file. However, it is not obvious that those C translations are to be taken as normative.

Leaving the cell's value unchanged is the behavior of Urban Müller's brainfuck compiler. This behavior can easily coexist with either of the others; for instance, a program that assumes EOF = 0 can set the cell to 0 before each , command, and will then work correctly on implementations that do either EOF = 0 or EOF = "no change". It is so easy to accommodate the "no change" behavior that any brainfuck programmer interested in portability should do so.

Implementations
Tyler Holewinski developed a .NET-based software framework, BrainF.NET, which by default runs brainfuck, but can also be used to derive various forms of the language, as well as add new commands, or modify the behavior of existing ones. BrainF.NET thereby allows for development of programs such as an IDE.

Although it is trivial to make a naive brainfuck interpreter, writing an optimizing compiler or interpreter becomes more of a challenge and amusement much like writing programs in brainfuck itself is: to produce reasonably fast result, the compiler need to piece together the fragmentary instructions forced by the language. Possible optimizations range from simple run-length peephole optimizations on repeated commands and common loop patterns like [-], to more complicated ones like dead code elimination and constant folding.[13]

In addition to optimization, other types of unusual brainfuck interpreters have also been written. Several brainfuck compilers have been made smaller than 200 bytes – one is only 100 bytes in x86 machine code.[14]

My LHD SHARE 2021

Ankita Sahu — Thu, 01 Apr 2021 09:27:31 +0000

What is Local Hack Day?
Local Hack Day is a week-long hackathon that takes place annually. Local Hack Day is taking place for the last 8 years(except 2020). It is recognized all over the world. It comprises of daily and weekly events. The complexity of challenges varies and therefore, the candidate attending the event and can do the task according to their own knowledge.

What is LHD: Share?
Local Hackday Share or LHD: Share is a 3rd part of the local hackday(LHD). Local Hack Day: Share is a week-long celebration of sharing everything you’ve learned as a hacker. If you’ve been hacking with us all year, we’re excited to have you back. If this is your very first event, we’ve got a ton of beginner-friendly challenges for you to complete that’ll have you shipping your hack like a pro in no time. You’ll have your pick of technical, design, and social challenges to complete - each with an emphasis on sharing your work. The more challenges you conquer, the more points you’ll earn. Tune in each day to check out the leaderboards and share what you’ve built.

What are the Features of Local Hack Day?
It’s compatible with a range of people.
They have leaderboard updates every single day, to return the enthusiasm to everyone.
It has guilds (group) formed from the whole community. And this guild helps every member of the guild to improve. The best and most famous is #BLAHAJGang🍉🦈.