DEV Community: Tejaswini

Your next Mini Project using dev.to api

Tejaswini — Thu, 14 Jan 2021 05:11:38 +0000

I used dev.to api to display my blogs on my portfolio.
Recently when I participated in a hackathon I used to to display the user's blogs along with search bar.

let btnDev=document.querySelector('#devbtn')

     fetch('https://dev.to/api/articles?username=powercoder')
    .then((response)=>

            response.json()
        )
    .then(data=>{
        let output='';
        data.forEach((element)=>
        {
            console.log(element)
           output+=
            `       <div id="grid-item">
                    <div>
                    <h4 class="titleblog">${element.title}    <i class="fas fa-heart text-danger"></i>${element.positive_reactions_count}</h4>
                    </div>
                    <div>
                    <a href=${element.canonical_url}><button class="btnc">Read more</button></a>
                    </div>
                    </div> 
            `


        }
    )
    document.querySelector('#grid-container').innerHTML=output;
    })
            .catch(err => console.log(err));

The above code snippet is used to fetch your blogs whenever you click the link of a button.

Explanation

So first use DOM manipulation to fetch the button whenever you click it you get blogs of yours. Then I used fetch api to fetch the blogs and it returns a promise which resolves to a response which is either successful or not.
So after the response convert into json format and then it returns an array of blogs written by the user.
I used grid and some HTML to display my blogs along with likes and heading.
The below picture is reference from my portfolio where I used dev.to to fetch blogs.

You can do this in react also it is a very good project to understand basics of react where you can create a search box and you can search for blogs of different users.
You can check the below project for reference. https://github.com/tejaswini22199/DevFolio

Everything About Hackathons-A place where your ideas become actions

Tejaswini — Sat, 21 Nov 2020 11:25:32 +0000

Why Hackathons?

Since Hackathons have time restrictions. You have to do the project within the given time and without procrastinating your work.
It will help you network with students from other colleges and know about them. Also, you can get guidance from many mentors and working Professionals during Hackathons. Hackathons will reveal the inner you, the talent in you. Since you will be choosing your idea from the given topics, you will be thinking out of the box creatively.
Another advantage is, you can enhance your skills in collaboration and Team making, as you work with others during the hackathon.
Some companies hire students through hackathons if they find your project creative.
Last but not least, if you make it into the final round it will be a good achievement in your resume/Portfolio as well as you will get rewards.

Do’s and Don’ts

When I attended my first hackathon recently, I observed a few things which I want you to know if you are a newbie to Hackathons. Choose a team that is willing to learn and do something. Because your team must not be quitting during the hack due to pressure. Be proficient in at least one tech stack. (ML, WEBDEV, ANDROID)
If you are a newbie, choose a small idea but a creative one that was not implemented before(something that is unique). Because there is time constraint choosing a complicated or big project may not give you output within time.
Brainstorm your ideas with your teammates, If you know the theme before itself and try to divide the work among your self and try to know the resources for your hack.

Some of the websites where hackathons are being conducted

2021 Season Schedule

Link

MLH hosts many hackathons across the globe. They also collaborate with top-notch companies. And they organize webinars with working professionals. They also provide you necessary stuff that you can use during the hackathon. Like, free credits for deploying your website.

Link

Hacker earth organizes hackathons actively where you can get benefits like FTE and Intern opportunities too.

Link

Tech gig is another website where hackathons are conducted.

Link

Devfolio is another website where you can find hackathons. That’s it guys. Hope you liked the content. Start applying if you want to upskill.

WRITTEN BY
Tejaswini
Follow me for more such content

Starter Templates for Hackathons and other Resources

Tejaswini — Fri, 20 Nov 2020 17:12:50 +0000

https://github.com/sahat/megaboilerplate
https://github.com/react-boilerplate/react-boilerplate
https://github.com/sahat/hackathon-starter

Learn any one of the frame works or fields like ML,WEB DEVELOPMENT ,ANDROID DEVELOPMENT, Game Development so that you can start working on something during hackathons. Learn one language like c++,Java,python,Java Script. etc.

Good code Practices

Tejaswini — Tue, 27 Oct 2020 14:56:34 +0000

Recently I learned a few best code practices, and I want to share them.

When you are writing a function multiple times that may cause buffer overflow. So the better practice is to store the function value and reuse it again.

Example:

int main()
{
    int size;
    cin>>size;
    vector<int> arr(size);
    for(int i=0;i<arr.size();i++)
    cin>>arr[i];
    for(int i=0;i<arr.size();i++)
    {
      if(arr[i]==*max_element(arr.begin(),arr.end()))
      {
        max_index=i;
        break;
      }
    }
}

In the above code instead of using the function arr.size() and max_element we can just store them in a variable and use it.
The naming of variables and functions:

So while you are naming any variable or function, use a name in such a way that others who see your code will understand what it is doing without prior knowledge of that language. I think many companies also follow this rule from what I heard.

Don't write complicated code. Make use of other alternative ways that are simple and easy to understand.
Use separate functions for different issues so that we can enhance the code reusability factor of object-oriented programming instead of writing all the functionality in the main function.
Object oriented programming principles are best ones to follow so that the code can be modified or extended by others later.
At the end but most important is to write efficient code in terms of time and space by using appropriate algorithms and data structures.

Note: I collected these from various sources, Feel free to add more in the comments so that others can learn! Happy Learning

Rest, Spread and Destructuring in JavaScript

Tejaswini — Mon, 19 Oct 2020 20:16:28 +0000

In java script rest , spread and destructuring are introduced to reduce the number of lines of code which are very useful for developers to minimize number of lines of code.

Rest

Rest combines all the given numbers or anything into an array.
For example,

If you want to find sum of 5 numbers

function sum1(...arr)
{
    let sum=0;
    for(let i=0;i<arr.length;i++)
    sum=sum+arr[i];
    return sum;
}
console.log(sum1(1,2,3,4,5));

Another Example

Given array of numbers sort the array

const arr1=(...arr)=>{
    let i,j;
    for(i=0;i<arr.length;i++)
    {
        for(j=0;j<arr.length-i;j++)
        {
            if(arr[j]>arr[j+1])
            {
                let temp=arr[j];
                arr[j]=arr[j+1];
                arr[j+1]=temp;
            }
        }
    }
    return arr;
}
console.log(arr1(3,2,4,1,5));

Spread

Spread can be used to split multiple elements that are combined

let day1 = [ "1", "2" ];
let day2 = [ "3", "4" ];

let combined = [ "0", ...day1, ...day2 ];
let combined1 = ["0",day1,day2];
console.log (combined);
console.log(combined1);

Output

[0,1,2,3,4]
[0,[1,2],[3,4]]

To find maximum of given numbers

let findMax=(...arr)=>
{
    arr.sort;
    return arr[arr.length-1];
}
console.log(findMax(1,2,3,4));

Destructuring

It is used to reduce the code by dividing the arguments of a structure

var student={
    name:'xyz',
    subject:'ec',
    cgpa:'10',
}
let res=(student)=>
{
   let{name,subject,cgpa}=student; //Here we are directly assigning to split
    return `Hi this is ${name},from ${subject} branch with cgpa of ${cgpa}`;
}
console.log(res(student));

Without destructuring

let res=(student)=>
{
   name=student.name;
   subject=student.subject;
   cgpa=student.cgpa;
 //Here more lines of code
    return `Hi this is ${name},from ${subject} branch with cgpa of ${cgpa}`;
}
console.log(res(student));

Destructuring in function argument

function greetings ({ name, subject,cgpa}) {
    return `Hi, I am ${name}.
        from ${subject} branch
        with cg of ${cgpa}`;
}
console.log(greetings(studentDetails));

Source where I learned: link

Bit Manipulation

Tejaswini — Sun, 18 Oct 2020 17:48:53 +0000

Daily learning

Today I learned few tricks in bit Manipulation and I want to share the same.

Important formulae

To do Left Shift of x by y bits x<<y
To do right shift of x by y bits x>>y
xor is useful if you want to find non-repeating elements when all others are appearing twice. You can just xor all elements to find unique element.
To check if a number is power of 2, You can do number&(number-1) if it is zero then it is power of 2 else not a power of 2.
To find if ith lowest significant bit is set or not (n&(1<<i)) Power of 2 : 2,4,8,16,...

Bit Manipulation is very useful when you have space constraints because we can reduce the space complexity using this.

-----------------------------------------------------------

To generate subsequences of a string which are palindromes
First task is to generate subsequences(It is part of string after removing some characters).Next is to check if it is palindrome or not.

Step1 : Find the length of the string. Now we need to generate 2 power length number of subsequences and check if they form a palindrome or not.
Step 2: So generate all the numbers from 0 to 2 power n
Step 3: Now we need generate subsequences. To do that if we need to assume the number as representation of subsequence where zero tells that character in the string is not part of subsequence 1 tells that character of string is part of subsequence. So what are 0 and 1
step 4:They are binary representation of string that we have taken so we need to convert each number into binary first then we can just add that character to the temporary string wherever 1 is present and we can check if it is palindrome or not.

Generate palindromic Subsequences from a given string

Code for the question

#include<bits/stdc++.h>
using namespace std;
bool ispalindrome(string s)
{
    int i=0;
    int j=s.length()-1;
    while(i<j)
    {
        if(s[i]==s[j])
        {
            i++;
            j--;
        }
        else
        return false;
    }
    return true;
}
int main()
{
    int t;
    cin>>t;
    while(t--)
    {
        string s;
        cin>>s;
        int count=0;
        int n=s.length();
        for(int i=0;i< (1<<n);i++) //it will generate pow(2,n) subsequences
        {
            string temp="";
            for(int j=0;j<n;j++)
            {
                int x=(1<<j);
                if((x&i)!=0)
                {
                //  cout<<s[j];
                    temp+=s[j];
                }
            }
            //cout<<endl;
            if(temp!="")
            {
                //cout<<temp<<endl;
                if(ispalindrome(temp))
                count++;
            }
        }
        cout<<(count+1)<<endl;
    }
}

Question Source: Hackerearth

Link

Another application of Bit Manipulation is when you are given few numbers and you need to check sum of the difference in bits between any two numbers.

For Example: 3 2 4 011 010 100 answer is 12

Code for question

#include <iostream>
#include <vector>
# include <cstring>
using namespace std;

int main() {
    // your code goes here
    int t;
    cin>>t;
    for(int k=1;k<=t;k++)
    {

        int n;
        cin>>n;
        vector<int> arr(n);
        for(int i=0;i<n;i++)
        cin>>arr[i];
        int bitset[32];
        memset(bitset,0,sizeof(bitset));
        for(int i=0;i<32;i++)
        {
            for(int j=0;j<n;j++)
            {
                int x=(1<<i);
                if(arr[j]&x)
                bitset[i]++;
            }
        }
        long long int res=0;
        for(int i=0;i<32;i++)
        {
            res+=bitset[i]*(n-bitset[i]);
            if(res>10000007)
            res=res%10000007;
        }
        res=2*res;
        if(res>10000007)
        res=res%10000007;
        cout<<"Case "<<k<<": ";
        cout<<res<<endl;
    }
    return 0;
}

Question Source:SPOJ

link

Source : link

Git-Hub Commands that are useful for beginners who want to contribute to the Open Source!!!

Tejaswini — Sat, 17 Oct 2020 14:11:14 +0000

Before going to that let us understand what is Git-hub. What is the difference between Git and Git-Hub, GIT is version control system which is used to track changes in the files where as Github is a software which enables you to manage your git repositories.

Commands

When you want to store a folder that is present in your local computer to the git hub which is cloud based software you need to initialize a git repository first.

git init: This Command is used to initialize repository in your local folder but it is invisible (stored as .git file) If you want to contribute to any other repository, you should first fork that repository into your account. For that, you can directly click the fork symbol using the UI of Git-hub.
git clone: To download your repository in your local machine. You need to have a branch for each of the issue that you are solving so you need to create a branch. Go to the file location using command prompt or git-bash.
git branch : It displays all branches of that repository.
git branch newb : Creates new branch names newb
git checkout newb : Used to switch branch to newb So now you can start modifying that repository in your local machine. After you modify to check the status
git status: Used to check the untracked files or un committed files Every time to you need to keep your local repository updated from where you forked because many developers will be working on same repository so you need to get updates that are merged to the repository. To do that
git remote add upstream link of source repo: which will add the repository from where you cloned as remote(remote is repo in which you want to contribute).
git add . : It is used to add the files to the state which we want to track the changes
git commit -m "Add a meaningful message which describes your changes" : It is used to add the changes to your local repository
git push origin branch name : It is used to push your files into local repository. Now you can create pull request by going to your repository in git Hub and the maintainers will be able to merge your branch if it doesn't have any conflicts.
git branch -d branch name : To delete a branch

How Hacktoberfest helped me in getting started with opensource!

Tejaswini — Fri, 16 Oct 2020 20:46:02 +0000

What I Learned From Hacktoberfest

Hello Everyone, Before participating in this event, I used to have basic knowledge about GitHub. After participating in Hacktoberfest, I learned many things related to Git-hub and also contributed to some repositories. I'll be continuing my contribution to the Open-Source in the future too. It is a great opportunity where students can brush up their technical skills along with building their Team player capabilities. My interest in Open Source is growing day by day. And this is just beginning only.