DEV Community: Aman Sharma

No more tears from project nightmares

Aman Sharma — Sat, 05 Dec 2020 11:54:51 +0000

5 things you are missing in your job application

Aman Sharma — Sat, 05 Sep 2020 08:11:05 +0000

Times have changed, as so is the process of recruiters. During our own screening process at twimbit.com, I observed what mistakes candidates were making. There were so many applications that only a few things stand out and help make our decision.

Don’t take me wrong but modern application portal are like tinder apps where best profile makes the difference. And there are trivial things that account for it.

I can confidently say that these things won't just be appreciated at our company, but anyone. I pointed these things out and mentioning them here. Surprisingly, you don't need to do a lot of changes, just minor mentions and corrections and you are good to go.

We will call them the 5 P’s -

Platform 🚉
Profile 😎
Profession 🧑🏻‍🎨
Portfolio 💼
Purpose 🚀

1. Platform 🚉

Many of us don’t realize but recruiters tend to stick with one recruitment platform. The main reason for this is the chaos it creates when you need to manage the application and visit various platforms regularly. Although there are many platforms, but they share the same process flow. You apply to an opportunity; they screen you and the process starts.

Now if you carefully understand your odds of getting more opportunity will increase if you have profile on multiple platforms. This information can be just copied from one another with minor adjustments. For you to respond and apply to positions is easier than recruiter stumbling around on various platform.

2. Profile 😎

You shouldn’t judge a book by its cover, but when you have a lot of choices, the cover does make an impact. In this case a recruiter on an average must screen 50 applications every day. This makes it difficult to go and check for individual profiles and read about them. It really helps in making the decision if there is something that stands out. These traits can be as simple as putting up a decent profile picture, writing a greeted intro, mentioning your skills, hobbies etc. You can arguably say that these things are mentioned in my resume already, but the catch is that a recruiter won't even reach till your resume and go with a better choice.

Here is a small example of 2 applicants, which one do you think stands out.

You will quite agree that the first one is more appealing than the second. It has a nice picture, a good bio, mentioned skills and of course past experiences.

Also don’t forget to mention appropriate external profile that count your experience. eg. Developers should mention there Github, Kaggle, hackerank or designer there behance, dribble etc. and your personal website is a huge must these days.

3. Profession 🧑🏻‍🎨

You should clearly mention the profession you are in or the one you want to pursue. Don’t leave it to your fate and the recruiter to decide. Usually when we look at an application, we are actually trying to find commonalities between what we need and what the candidate already possesses. Also, don't confuse your expectations between full time, intern, part-time and freelance. You yourself know what you deserve and what you are capable of. Minor hustling is OK, but dream castles not. Mention what you aspire and only go for the opportunities that meet your expectations. These things make it easier and faster for recruiter to decide.

4. Portfolio 💼

You may not have experience in the position your applying for, which is completely fine, but you should have at least done something in past in that field. A recruiter definitely wants to have a taste of your work style. For developers going for technology stack-based opportunity, should mention a sample project or an open source contribution which can show their work. Designers should have their mood boards or past work mentioned. A cherry on cake can be, if you are an influencer of your domain like a speaker, blogger, opensource maintainer. So, keep on trying these things and cataloguing them on your portfolio.

So next time you are working on something keep them logged somewhere. A best practice can be writing a blog about it. Others can learn from it and recruiters can see your work.

5. Purpose 🚀

Apart of the tabular data you have added to your application there should be oozing passion. How can you do that? by adding your personal swag in your work. This is applicable to all the above-mentioned points. To start, write your goals on a paper and whatever you write in the application field, think about how your goals match with it. Also ask your friends to review your application and ask for their first impression (but don’t ask the people that care for your feeling 😓).

Wrapping up 📜

If you do all these things properly your application can truly be reflection of you. Good things don’t come easy and bad time doesn’t last long. Be patient and humble to each opportunity. Also be experimental with your application if something doesn't sounds right try out something else. You should keep on trying new ways to make your application stands out.

I hope this note would have helped you and you can reach out to me for any queries or advices.

Try out positions on twimbit careers.
Careers | Twimbit
*Careers Let's Imagine and build your career together. Gallery Keynote/Talks Team Manoj Menon in one of the speaking…*twimbit.com

Launch your startup with this free toolbox | No budget — No hassle

Aman Sharma — Sun, 16 Aug 2020 09:22:05 +0000

This read has everything you ever wanted to know to get started with your startup idea with no investment.

It’s been a while since I am in the start-up league. Over the course of time, I have made multiple mistakes, while making good decisions. Often, I am asked, how to start with a start-up idea? Of course, there is no simple answer to that. Most importantly, it’s your validated idea and second is your willpower. There are some good reads that can help you in getting the basics right such as Zero to One and The 4 Steps to Epiphany.

Despite sounding simple, it can actually become tough on the ground. So, rather than making it easier on papers, validate your idea by executing it in reality. If it’s a success, great; otherwise you can improve and perform better than before. Miraculous outcomes of seeing a thousand customers in the first month is a far-fetched ambition.

Ending the excuses

It’s easy to get lost in the fuss and build long-term plans with many loopholes impracticalities. You can choose to wander in such plans for weeks, but they won’t fetch you anything. The real answers can only be heard once you start. So, in this blog, I want to tell you the things that you can use to build your start-up without burning your pocket on extravagant things. Keep it simple and when you have the money―improvise.

Always keep in mind

Things don’t need to be perfect in the first go, your audience will gradually grow in number, giving you plenty of time to iterate and become better.

It’s easy to feel that an investment can solve all your problems. But that’s what every other entrepreneur is thinking. The real creativity lies in the scarcity. Think this as an opportunity to create something more awesome even when you have fewer resources. So for now just focus on getting started which can be done with minimum budget and rest you will figure out later. In this blog, I am going to tell you about the tools and their implementation process. You may be familiar with some of the tools, but I have some hidden ingredients.

Name

Keep it simple and easy to pronounce (Don’t put too many lingos or hard to remember crossmatch), but something that makes it easier to remember.

Advice: Go with something that is popular in your product domain. For example, Twimbit was named as an acronym for The world is moved by ideas and technology.
Business Name Generator
*Most business name generators combine dictionary words to make longer names. Namelix generates short, branded names *namelix.com

Logo

Follow the rule of simplicity and create a first draft that should be good enough to go with your idea. In the beginning, it can be as simple as your company name in a good font and color combination.

Advice: Don’t try to copy the logo theory of combining words, it’s just stupid. Eg. if your company is FastServers you may think of going with FS coupled over each other.
Hatchful | Your digital logo designer
*Introducing Hatchful - our simple logo maker. Get started High-resolution logos in just a few clicks Ours is the logo…*hatchful.shopify.com

Website

Once you have a name ready, purchase a domain from any seller like Godaddy or NameCheap. Then, you can use “Stackbit” to generate a good looking and fast website for you. Stackbit takes care of theme, deployment and free hosting with some simple clicks.

Advice: Put regular blog posts, FAQs, and a clear product statement on your site.
Stackbit | Stackbit
*JAMstack is a modern web development architecture based on client-side JavaScript (J), reusable APIs (A) and prebuilt…*www.stackbit.com

If your start-up needs an e-commerce presence you can use “Square”. It comes with a built-in payment solution.
Sell Online - Build a Free Online Store or eCommerce Website | Square
*Alert Curbside pickup and local delivery are now available through Square Online Store. Monthly fees for local delivery…*squareup.com

Customer communication

In the process of building your start-up, always remember to keep your customers closer, while communication is frictionless.

Advice: A happy client is word of mouth marketing for your brand.

Emails

Start with “Zoho” mails, which comes with 5 free business emails and if your team grows you can switch to other premium plans.

Advice: It’s unprofessional to use a “Gmail id” for client communication.
Email Hosting | Ad-Free Business Email Hosting - Zoho Mail
*Zoho Mail's powerful Control Panel is the admin's go-to place for all settings, configuration, and customization. Add…*www.zoho.com

Hiring

To build a strong team, you need a good set of minds. People who can belive in your Ideas and take them forward. From the beginning, there has been no better platform to get good talent then angelist. It’s free and has a good crowd. Additionally, it has a good hiring app that makes shortlisting candidates much easier. https://angel.co/recruiting/

Advice: Give a sense of responbility to new comers and full trust. If they proove to be valuable keep them as an asset. If not don’t keep them tied up for too long.

Teams collaboration

Slack is always a go-to solution for me in this case. It is free for unlimited users and offers a lot of features that can help you communicate and share ideas with the team.

Advice: To manage tasks, you can use Trello, which offers easy kanban boards ( drag and drop based board columns), keeping track of all ongoing activities.

Accounting

Accounting must be managed properly from day one. It helps in keeping everything in check and restricts you from overspending from your pocket.
Accounting software - Free small business bookkeeping software
*The best accounting software that is also free. Millions of small businesses use Wave's award-winning accounting and…*www.waveapps.com

I have been a huge fan of wave as it makes accounting an easy-breezy. .You can manage invoices and collect spending receipts easily with mobile apps. It also helps in company analytics on profits and expenses, completely free.

Email Marketing

Keep your consumer informed with the latest updates and offers. Mailchimp helps you to manage all-round customer email campaigning in a free plan.

Advice: Try possible methods of capturing their emails such as, webinars and free giveaways like an ebook or a small gift. This will serve you as future leads.
Your marketing universe-all in one place | Mailchimp
*Mailchimp is the All-In-One integrated marketing platform for small businesses, to grow your business on your terms…*mailchimp.com

Bonus

These are a few tools that every start-up would need but if you still need some more, you can check out “Secret” and get utilize various offers/credits for start-ups.
Secret - Exclusive Software Perks for Entrepreneurs
*Secret is the #1 software discounts platform for entrepreneurs. Sign up for free and save money instantly on your…*www.joinsecret.com

Conclusion

Now that you have everything in place which was on your mind before kick-starting, don’t wait anymore. It is okay to make mistakes, they often tend to result in better products. Listening to your customer problems is a great way to learn and become better, rather than pondering on the problems that you think they might have. Get on the ground and get real feedback. Talking on getting real, below is a bonus read for you. Good luck and enjoy!
Getting Real
*A must read for anyone building a web app. Getting Real is packed with keep-it-simple insights, contrarian points of…*basecamp.com

Google analytics with Reach router in 5 steps

Aman Sharma — Sun, 16 Aug 2020 09:20:03 +0000

Analytics is very important to track the performance of your web app. In a single page application, you would like to see the changing URL in Google Analytics Dashboard but as the page path changes, it doesn’t loads and sends the data automatically. Hence Just including the Google Analytics script tag won’t work. In this guide, I would take you through each step that you need in order to set up Google analytics with reach router that sends real-time data on each page change.

Reach router is a small, simple router for React that borrows from React Router, Ember, and Preact Router. Reach Router has a small footprint, supports only simple route patterns by design, and has strong (but experimental) accessibility features.

In this guide, we will use React-ga that handles the Google Analytics tag and sends that data whenever there is a URL change by listening to the route changes.

Step 1: Setup Google Analytics Property

We will first create a Google Analytics property and obtain the tracking ID

Step 2: Install React GA

React GA is a JavaScript module that can be used to include Google Analytics tracking code in a website or app that uses React for its front-end codebase.

Installation using npm:

npm install react-ga --save

Step 3: Import required modules

Now we would need to import the following modules from the Reach Router and the react-ga library in our App.js

import { Router,createHistory,LocationProvider }from "@reach/router";
import ReactGA from "react-ga";

Step 4: Setup tracking Code

Initialize Google Analytics with the obtained tracking ID in the first step in the global scope just after the export in App.js . Also, declare const history globally that enables you to record the browser history. We will use the constant later.

ReactGA.*initialize*("UA-103xxxxx-xx");
*const *history= *createHistory*(window);

Step 5: Handle the Routes

Now declare *in return statement of your const App *ifi function in App.js so that all components are inside it. This will help us listen to the URL’s as the route changes.

Step 6: Send the Tracking Data

Now on every URL change using history.listen, we will trigger and send the data using ReactGA.pageview. For this, we will setup a function that listen to the history object and changes the value of ReactGA.pageview object inside the const APP ifi function in our app.js

history.listen( window => {
  ReactGA.*pageview*(window.location.pathname+ window.location.search);
  console.log('page=>',window.location.pathname);
});

Here window.location.pathname is the URL and window.location.search are the URL Params.

Your dinal setup in App.js should look something like this

Run your code and you should be able to see the changes live in google analytics dashboard as you change the path.

Bonus Step: Sending Aditional Info

You can also send additional information using React.GA such as user ID, demographic, preference and other additional information and even on certain triggers using the same approach.
react-ga/react-ga
*React Google Analytics Module. Contribute to react-ga/react-ga development by creating an account on GitHub.*github.com

Introduction to Serverless/Edge scripting

Aman Sharma — Sun, 16 Aug 2020 09:18:16 +0000

Did you ever wonder how cool it will be if you can run things above your actual code without fiddling on your deployed servers? You might be thinking why would you even need that and there can be many reasons. It can be you want to redirect the app to different URL for mobile, want to add some additional tags in the head, give a response before running the code and many more. Serverless scripting is the way to do it.

Meaning

Serverless scripting (a.k.a. Edge Scripting) is a Script ( In any language, commonly JS ) run on serverless computes (Edge) is a way to run a piece a code before the execution of your actual app code to perform various functions including prefetch response, appending body, adding headers, returning response code, redirecting the url and similar things.

So Basically running the script without your own server but above it on serverless. It’s packaged under various names from various CDN providers like Stackpath serverless scripting, Cloudflare Workers, Amazon Lambda edge

Working

Serverless scripts can be inserted in the CDN environment that deploys instantly on servers across the world and starts performing the job. The working can be understood from the following image-

Source: Cloudflare

So what is happening here is that whenever there is a request, the CDN/ Edge Servers requests that from the origin server. Then it runs another script on top of this response in which you can perform different actions as you like. This is basically modifying the response from the origin server.

Implementation

The first requirement is that you need to route the traffic through a CDN or an edge server. Not all but most CDN these days provide this feature like MaxCDN, Stackpath, Cloudflare, AWS Cloudfront.

You then need to activate script functionality and add the script to the serverless/edge section of the provider here is an example script that adds an AMP link tag which is canonical of the actual URL.

// check the incoming request

addEventListener("fetch", event => {

    event.respondWith(fetchAndModify(event.request));

});

//function that runs on the requests

async function fetchAndModify(request) {

    const *response = *await fetch(request);

*// Check response is html content
if *(
    !response.headers.get("content-type") ||
    !response.headers.get("content-type").includes("text/html")
) {
    *return *response;
}


*// Read response body.
const *text = *await *response.text();
*// modify the URL
const *url = response.url.replace("https://",'https://content.');


*// add the tag by performing replace on head .
const *modified = text.replace("&lt;head&gt;",'&lt;head&gt; &lt;link rel="amphtml" href='+url+'/amp &gt;');

*// Return modified response.
return new *Response(modified, {
    status: response.status,
    statusText: response.statusText,
    headers: response.headers
});



}

Pros

No code modification to the actual code.
Runs as server-side script even on CSR project.
Scalable and deploys to the world in minutes.
Saves time on deploying things to the actual code base

Cons

Requires a CDN/ Edge server above the original server to handle requests.
Comes at a cost
Can’t do a lot of DOM manipulation

Conclusion

Serverless scripting is simple and efficient. More and more CDN’s and platforms are adapting and offering them as a service. So next time if you are looking for a solution that could be a script that runs before the actual code, serverless scripting is the way to do it.

Hosting your web app at the beginning and the 6 things you should consider

Aman Sharma — Sun, 16 Aug 2020 09:15:43 +0000

There are a lot of hosting platforms to choose from these days. If you have just started building your web app and don’t know much about what hosting to choose, this read will help you understand about hosting services and also which one makes more sense to choose. This comes from what we learnt when testing our beta apps at Twimbit.

The biggest trap

When it comes to hosting our app there are many fancy terms that come across. You worry about the load, traffic, speed, uptime and what not. And then it becomes more difficult out of all the hosting providers like AWS, GCP, Azure etc. You would probably read a comparison test and choose the one that you think stands out. Some of the hostings also offer you free credits and you probably would think, Why not, it's free. Here is where we fall for them. It would be easy on your pocket but you will need a lot of knowledge and time before deploying the app. So the money you were thinking you saved is wasted in the time you spend in learning all those things. The actual question is, do you actually need all that for your initial stage. So instead of looking more into the specs, you should instead consider the hosting that is much easy on everything. If you talk about major web providers they were actually built for large scale application in mind. One should have proper knowledge about the Kernel and network before deploying the app on a self-managed server.

Types of Hostings

Shared hosting — In this hosting the resources of the server are shared among various other websites. This is cheapest as the cost is also shared among others. But if one site gets affected with malware your site will be vulnerable too. This will only happen with a cheap hosting provider as the good ones take the job of security very seriously.
Dedicated hosting — In this hosting, you have the complete ownership of the server and control each variable. It's expensive as you have to bear the whole cost. Also, you need to be a technical expert to manage the hosting.
VPS/ Cloud hosting — This hosting is most on-demand as it offers the flexibility of scaling the resources as your application size increases and you only pay for what use. But again with this hosting, you need to have technical expertise with the cloud environment.

So for a beginner application, it makes more sense to host it on a managed shared hosting. You don’t have to pay much for it and also you don’t need any technical expertise. Shared hosting comes with an easy to use console where you can manage everything about your application.

What things to consider?

Support

You don’t want to get messed up with hosting problems that come and there is a long list of them, from permissions issues to simple problem like HTACCESS error. A good hosting provider will take care of everything and will make sure that the application should run smooth. You should definitely check for 24 x 7 live chat support that really helps a lot at times.

Availability

You should consider where the server is actually located. Mostly it should be near to the area of usage so that the support time zone matches and also the response time is less.

Security and Backup

A good hosting provider will take the responsibility of security in their own hands. They come with Virus scanner and free SSL certificate and if any threat is detected on the shared server the site is quarantined until the issue is resolved so that the other sites don't get affected. Also, automated backups is a must these days. Daily automated backup can help you rollback to last stable version of your web app without you worrying about anything. Even if you messed everything up.

Hosting environment

This depends on the stack you have and the OS you will need out of Windows and Linux. The most application works with Linux. On top of this, there is managing setup that helps you manage the settings and also upload the code. CPanel is the easiest to use and offers a lot of features.

Uptime, Speed and Limit

Uptime is in percentage that is the time that your website would be guaranteed up. 99.9 % is good enough as the hosting provider needs to apply patches and schedule maintenance. For speed, you can check pingback from any of the hosting websites which should be less than 200 ms. There are 2 types of limits, Bandwidth and storage. There is nothing like unlimited hosting so don’t fall for it. Calculate the actual need and go for it. If the need increases which is good, you can expand and also migrate out.

Cost

The first thing is “ Don’t go for free”. The hosting provider will lure you and when you are most dependent on the hosting, it will probably ask for the charge. So consider all the above 5 points and choose a decent one. Normally it should be around 10K INR or 120 $.

Conclusion

In my opinion, the initial stage for application development is most complicated as you are struggling with the ideas. At that time adding hosting problem to your list is not a good thing. Shared hosting can take the load from 0 to around 5000 users. Till then you should have gained the confidence about your tech stack and also what kind of hosting you should choose from. On the Next milestone, you can go for Cloud hosting that can help scale to any number of users.

Some good managed shared hosting( not sponsored )that I came across in order as follows -

A2 hosting
Blue Host
Siteground
Hostgator

Seamless paired AMP + ReactJs PWA | Goodness of both in one

Aman Sharma — Sun, 16 Aug 2020 09:13:37 +0000

There is always a time while developing web apps when you have this dilemma about which stack to choose. We usually have to trade-off between the performance (faster load times) or aesthetics ( the user experience ). All frameworks have there pros and cons and I don’t choose to favor one over another. But instead of choosing a single stack, I thought it would be cool to try something new and go with a paired tech stack. In this read, you will be able to see the why and Ifs to both of these technologies and how you can make them coexist enabling a seamless user experience. The final outcome is going to be a web experience that will use AMP for improved search results and instant load in search appearance proceeding to a React PWA that has fluidity enabled by virtual DOM. This means that we have to create 2 frontends with the exact same content and UI so that the user doesn't feel much difference. This read will cover the why and the Approach. And the next read will how and the steps to accomplish this.

Who will actually need this?

Ecommerce Sites relying on Google Search for customers and then wanting to have a closer audience with PWA
News and media sites with quick SEO ranking needs
Content sites like medium and Twimbit

Why AMP+ReactJs?

The usual scenario for a person to discover your app is via Google Search. AMP has a unique advantage over other frameworks that it can perform better on search rankings and also gives a bolt icon to your search results. It will also give an instant load as soon someone clicks the AMP search results which feels as if the content was part of search results. This can be easily achieved if you can create a 100% valid AMP Page. You might have compromise on some aesthetics and user experience on the way to have a 100% AMP valid page. It would look great, as AMP has almost all the web components. Switching between the pages would be as instant but not seamless.

This is something we discovered on the path of creating a perfect PWA that the navigation should be seamless. And for this particular reason, we have to move to ReactJS because of its Virtual Dom implementation. But the important part is how to make this transition without the user even noticing it.

The Approach

Following is the scenario for our users —

The user finds an AMP-enabled search result with a bolt icon.
On clicking the results it will take him to the cached version of the AMP page.
On any further click, it should take him to the React Page which is PWA enabled
Users will choose to install our PWA on the install prompt.
Now that our PWA is installed any repeat visit to search results containing our domain name will take him directly to our PWA.

Steps

These are the overview steps to do it with WordPress

Create an AMP valid WordPress theme with all components as per your design requirements with link Relation of React page.
Install WPGraphQL plugin
Create ReactJS frontend with all components as were in AMP theme
Fetch the content from Wordpress via GraphQL( we have user Apollo client)
Keep the URL structure the same as of the WordPress permalink Structure
Enable PWA
Apply URL forwarding using HTACCESS method

The detailed method to create this experience is in my upcoming Read.

Things to consider

The UI should look almost the same for a smoother experience
AMP page should be 100 % valid in order have bolt sign and cached google result
Both frontends should be hosted in the same parent domain but with different subdomains (“amp.domain.com” + “domain.com” )*or directories (“domain.com/amp” + “domain.com”).*
The URL structure should be the same.
If your site is dynamic then there should be Backend CMS to serve paired content to both of the Frontend.
ReactJS page should be PWA enabled.

Here is an example stack of what we used at Twimbit to accomplish the approach. WordPress as backend CMS with paired AMP theme and ReactJS connected using WPGraphQL.

Conclusion

Though it feels very complicated actually creating this was fun and really simple. The entire Development cycle took 4–5 weeks with just 2 developers one for AMP + WordPress and the other for ReactJS. Everything that we used is opensource and well documented. And in the Next Read, I will tell the actual steps to create this stack with all links to the Documentations. We didn’t face many issues apart from some CDN and server-side errors which are also covered in my other reads.

Exciting new features to Google Chrome/Web in 2020 | Inside Story

Aman Sharma — Sun, 16 Aug 2020 09:09:45 +0000

Chrome is the favorite browser among all categories, but what it makes for developers too is the features it provides to the developer community. With the statement of bringing always fresh and exciting tools for the developers let’s see what can we expect from chrome in 2020. They got announced at the Indian web community lead summit and Google for Mobile conference last week so chances are you won’t find this information anywhere else.

Chromestatus.com

Before jumping into the actual features, this information is not too Top Secret. You can visit chromestatus.com to find out the upcoming, in-development and deprecated features.

New Features

Kenji Baheux ( Product Manager Google) announcing upcoming features

Portals

The goal of portals is to improve navigations, by providing faster and smoother transitions on the web, while maintaining the user’s privacy. This will be an alternate to iframes which can be implemented with similar kinds of tags.

<portal id="myPortal" src="https://www.example.com/"&gt;&lt;/portal>

Periodic Background Sync

Periodic Background Sync provides more background processing power to web apps, by allowing them to schedule a task to be run in the background periodically. The task will usually also require network connectivity and will be used by apps to update state or content. With this, any PWA can run background jobs such as download media/files offline at a specific day time

Content Indexing

The content index allows websites to register offline enabled content in the browser. This allows the browser to improve the offline experience and allow content browsing when the user is offline. This data could also be used to improve on-device search and to augment browsing history.

Web Bundles

A Web Bundle is a file format for encapsulating one or more HTTP resources in a single file. It can include one or more HTML files, JavaScript files, images, or stylesheets. This means you can carry your web project like an executable file and carry it wherever you want.

Lighthouse Bot

Lighthouse is a great tool for auditing site Performance, Accessibility and improving PWA capabilities. With the same capabilities Lighthouse bot, a CI utility is available to the public that helps in automatically performing audits on every PR.

Llama Pack

Llama Pack 🦙 is a Command Line Interface (CLI) that helps developers to create a Project for an Android application that launches an existing Progressive Web App (PWA) using a Trusted Web Activity (TWA).

New Chrome API

SMS Reciever API

SMS Reciever API solves a major bottleneck in providing seamless web experience when browsing Web Apps. It will allow web apps to get SMS content such as pin authentication which generally took users to another screen something that can force a person to jump between apps remember the pin and comes back and enters. This is already implemented in IOS safari and will be coming to chrome too.

File System API

File Handling provides a way for web applications to declare the ability to handle files with given MIME types and extensions. The web application will receive an event when the user intends to open a file with that web application. It adds more bells too such as multiple file upload, directory upload, file upload progress and drags a drop to area upload like features.

Contact Picker API

This API will allow web apps with secure access to pick contacts from the user‘s phone books. It can be implemented in various uses cases like booking air tickets for someone or filling out forms. It again reduces a lot of hassle of switching between apps and copying contacts and going back to the web app

Biometric Authentication API

Technically, *Support for CTAP2 FIDO devices via the Web Authentication API *will provide advanced security capabilities such as biometric authentication and resident keys (keys stored on the device).

Deprecating/ ChangingFeatures

Chrome Apps & Extensions

Chrome had a bad reputation for being RAM hungry and consuming a lot of computing power. That was true because, with every tab, every app/extension is consuming its own processor thread resulting in multiplies compute consumption. Google has already removed the app section from the chrome web store and soon will start deprecating them. Similar action to the extensions could be taken.

Cookies

Google is coming up with ever new cookie policy that could change the way we use and store cookies a lot. There is no clear information available on what it will actually do and how it will impact the user, But for sure Google is becoming more concerned with users’ privacy and this could be a major change to its policy.

Conclusion

With the passion of always staying at the top, it looks like Google is doing a pretty amazing job. But it is always dependent on the wide acceptability of the features across other browsers and by developers.

Let’s See who wants to go the extra mile to make web even better.

Static Site generator with Content Management | Gatsby + Forestry

Aman Sharma — Sun, 16 Aug 2020 09:07:38 +0000

Want to have your own single page application (SPA ) CMS based portfolio. This simple guide will help you out.

The Static site generators

Having a website these days is not just about looks. Performance is as important as the looks. That’s why the trend of static site generator is on the rise. It not just improves the performance by a factor of X but also improves the search engine optimizations. Static pages are easy for search engines to crawl and hence improve SEO ranking a lot.

There are many static site generator based on various front end framework and languages. I personally got the chance to test some of them which are Jekyll, Hugo and Gatsby. Among all of them I loved the experience with Gatsby the most. It is ReactJs based, makes the website in the form of SPA ( Single page application) and also has a lot of plugins and support community.

Comparing different static site generators

The Content Management System

But you just want a static site but ability to manage the post and content easily.

You might get confused between static site generator and static sites, so let me clear this first. Static site generator can be related with a machine that takes the dynamic content and converts them into bunch of static pages which are fast. Here our content is dynamic which are regular post and media but stored in static format instead of wordpress mechanism of storing them in Databases

This also leaves you with the possibility of editing the backend things without going under the hood. For this, you need to use a Content Management System or CMS. Again there are many in the market. Gatsby supports almost all of them because of its GraphQL integration. A popular one among them is WordPress, Forestry and Contentful. For my project, I chose Forestry because of 4 main reasons -

Code is still available to edit and tweak outside the CMS.
Backend is easy and fully customisable
The file management is easy
It does code commits for me which improves my GitHub profile and also helps the automatic deployment process.

The Version Control

So now we are using a CMS that does code commits we would need version control to store our code. For this, the choice was simple “ GitHub”. It’s free and gives that adrenaline rush of committing the code that encourages to work more and more.

The Hosting

It's totally up to you what hosting you want to go with. But for our stack, the best is to go with Netlify hosting. Following are some clear reasons for that -

Automated deploying of the site to live as soon the code is pushed
Deployment logs
Developer Support
A content Delivery network built-in.

The Final Stack

So we have now a clear idea of what stack we need to use.

Github to store code and commits
Forestry to do commits for us and manage the content in a friendly manner.
Gatsby to generate static sites
Netlify to pull the code from master and deploy it on web

Installation steps

Visit https://www.stackbit.com/ and got to get Started
Choose the theme you will like for your website
Select Gatsby as static site generator
Select Forestry as CMS
Connect Forestry and GitHub Account ( Create them if you don’t have already)

Vualla your website is ready !!

Your website will be automatically built and deployed on Netlify. To manage the code you can pull the code from the repo created in your GitHub account. To edit the content and various element of the website you can get to the forestry dashboard.

The steps are simple and so is the maintenance. The website delivers a performance of 90 on google lighthouse which is amazing.

You can also add analytics and other useful utilities from Gatsby plugin directory. This can be done by simply pulling the code from master to your IDE and doing the steps as directed in Gatsby documentation and then pushing the code to the master. Netlify deploys bot will automatically sense a new commit to master and deploy your website.

You can contact me if you faced any troubles as I Did a lot and can help you with your own deployment.

Originally published at https://amansharma.dev on August 16, 2019.

Getting Featured as top 10 most inspiring CTO's of India

Aman Sharma — Sun, 16 Aug 2020 09:03:24 +0000

KEY MANAGEMENT

Aman Sharma, Co-Founder & CTO | Twimbit

An innovator and go getter Aman is passionate about emerging technologies and has dedicated years learning the intricacies of coding. Armed with an engineering degree from BIT Mesra and work experience across various global organization, he is leading Twimbit’s technical team for operations handling and product development.

History has been a testament to the undeniable power of youth. When the vigour, exuberance and fearlessness of youth is channelled in the right direction it can even move mountains. Substantiating this perspective is the story of Aman Sharma. All of 21 years, the co-founder & CTO of Twimbit, a Singapore-based startup is an enterprising technocrat with a penchant for coding. Having worked for companies such as Tomorrow System, IWASSA, Infamous Labs and founded KiEvents & Atlancey, all during his college years, Aman’s list of achievements is already several feet long.

Having come on board Twimbit three months back, the young trailblazer is now working towards building products that revolutionize the way people consume research. In a candid conversation with the CEO Insights, Aman takes us along on his life journey from being a young coder in Jammu and Kashmir to becoming the CTO of an innovative tech organization.

Take us through the first few years of your life. How were the foundations of being a technocrat laid down for you?

My tryst with coding began when I was barely 12 years old and I had developed a software. Back in the day we could not afford a computer so I used to utilize all my free time in my school’s computer lab or library learning new technologies and coding. I was disappointed when I could not make it to IITs due to a family problem, but I did not give up and found my way into BIT Mesra through a scholarship program.

In my second semester, I got the opportunity to go to Egypt and work with an NGO as a web operations manager. I was then presented with the opportunity to work for an Italian company. Simultaneously, I developed Atlancey, a provider of private web services which gradually grew into a profit making venture with 15 people in the team.

I later worked as an AI engineer for Exclusivi, the largest AI company for hotels in Egypt. During my two yearswith the company I learnt about convolutional neural network and recommender systems, which is my AI expertise. Upon completing my engineering, I was a part of startup India program for KiEvents, an events AI startup.

One must never think that they know everything, instead we must listen to everyone and everything in order to widen our horizons

It was then that I started providing proto typing and web services for Twimbit. Since they did not have a tech team, they asked me to come on board as the CTO and here we are today.

You have had the opportunity to work with a plethora of companies across the globe. What was it that convinced you to come on board Twimbit?

My biggest inspiration to join Twimbit is ManojMemon the founder of the organization and has over 21 years of industry experience.

Another factor that propelled me towards Twimbit is the kind of disruption that the company intends to bring to the way users consume research. We had identified that consumption of research in today’s industry is very low, thus the company is building products for enterprises and individuals alike that will help with analyzing relevant knowledge one requires for making decisions for better business outcomes. For our enterprise clients, we have a terminal where an employee can log in and all the information required to smoothly run the company’s operations will be presented in a neat dashboard in graphical form. For individual users, Twimbit is building an application environment system that studies users’ habits to predict the best possible time to push them to learn some thing new.

Working with a supportive team on innovative ideas such as these has been energizing me immensely. I also got the opportunity to present a talk at Google DevFest recently and there will be many more to follow in the days to come.

Can you tell us about a few innovations and technologies that you are working on at Twimbit currently?

We are building an MVP prototype, called twimbit pro, through this we are trying to come up with different presentation styles to presentinformation in novel ways. The application will include the usage of Instagram like stories, which will render a ‘tappable’ experience to users and make content easier to consume.

Also, while researching we understood that nobody is installing native applications anymore. Therefore, we have come up with the idea of having progressive abaps as the only mode of installable material for phone devices. We made also made an open source framework towards using Google accelerated mobile pages(AMP). Leveraging AMP and abaps, we aim to provide a fast experience inside the web console and without a user having to install a native app. The application can also work on low intensity networks, provide accurate information and a platform where content creators can create content hassle free.

What role has your family played in shaping you as an individual?

Interestingly enough, my father did not know about my startup till a few months back. He is an army man and wanted me to join the Indian armed forces as well. But my aspirations were different, as I wanted to explore the world of technology and travel the world. It took me some time to convince him, but upon seeing my journey from an engineer to a successful CTO, he has changed his mind and is completely supportive of my dreams now.

My mother has been my driving force since the very beginning of my career. She was the one who brought us out of the village and into the city so that we could receive the best education and could pursue all our dreams.

Your journey is admirable and serves as a great example for budding technocrats. What would be your words of advice for them?

I believe that we must always be open to new thoughts and ideas. One must never think that they know everything, instead we must listen to everyone and everything in order to widen our horizons and gain valuable perspectives in life.

Building exciting lightning fast Web Apps | The Why and How Guide to PWA.

Aman Sharma — Sun, 16 Aug 2020 08:59:40 +0000

Why ?

Why no to native ?

There were times when the world was crazy about Native apps. The excitement people use to have on having the best apps in there phone. Native apps provided developer the flexibility to reach the highest level of UI experience without comprising much on performance. Soon the apps got bulkier and people start loosing interest in downloading the apps or keeping up with them. A recent study showed that on an average a user installs 0 apps per month. That should not be surprising because you also have only the most frequently used apps. On top of it if you want to cover much larger audience you have to cater all platforms that means that long development and complicated DevOps. To make things worse, the requirement of app keeps changing and your features development can not keep up with user demands. So too much effort you spent on developing native app and not much engagement after-all can be demotivating.

Following are some other Con's of Native app development :

Takes download time and user can't see any preview before installation.
Longer Development time and huge learning curve for native frameworks.
Store listing requires different set of licensing, authentications and IDE + tools.
For starter apps low user base discourages users from downloading App.
Bug Fixing and new feature addition take too long development cycle to actually reach user as an update and most users don't even update apps frequently ( Especially in India).

But can web app match native apps ?

The absolute answer is Progressive Web Apps(PWA). They were made keeping in mind the promises of app and flexibility of web development.

This Site tells you the present capabilities of PWA.

On the downside web can be slow which is a nightmare and will loose lot of audience. According to Google 50 % users will leave your site if it doesn't load withing first 3 seconds.

The Solution to this is choosing the right web framework and good code practices.

How ?

How to setup PWA ?

Setting up PWA is not a daunting task at all. If you know some basic JavaScript, you are good to go. Also it doesn't depend upon the web framework you are working with. You just need to specify a manifest file and a service worker, that's it. My colleague at Twimbit Sidhant understood it very well and did a very good job, delivery us amazing results.

The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when 'installed' on the user's mobile device or desktop. Having a manifest is required by browser to show the Add to Home Screen prompt.

A typical manifest file includes information about the app name, icons it should use, the start_url it should start at when launched, and more.

A service worker, written in JavaScript, is like a client-side proxy and puts you in control of the cache and how to respond to resource requests. By pre-caching key resources you can eliminate the dependence on the network, ensuring an instant and reliable experience for your users.

This Guide tells how to create a PWA in 5 mins. You should definitely check it out.

How to make PWA behave like an App ?

Choosing the front-end framework -
- Solution may vary from framework to framework. Most web framework these days come up with built in support for PWA. But it is preferred to go with light weight client side frameworks that results in greater performance and less server side rendering. Following are some popular options-
  1. ReactJS
  2. Angular
  3. Gatsby ( ReactJS based)
  4. VueJS
  5. Polymer
  6. AMP ❤️
  7. PWA + AMP (aka PWAMP) has a great advantage of being fast at first load and afterwards service worker caches the file in background. Also the learning curve with AMP is small so it makes a good choice for web app projects. (Do check my guide to AMP)
Keep the UX /UI feel like native but using few libraries -
- As your app is hosted on web, you would want to avoid using too many libraries to add effect like swipes and animations. You should make efforts to make your UX/UI more close to native at the same time keeping fewer libraries that ensure performance with richness of fluidity ( I am also currently working on this)
Optimizing the cloud hosting and back-end architecture -
- At the back-end also you need to take care that server response time is low and assets are being delivered at its best. This includes setting up a CDN, Compressing the assets, writing a good service worker, server side optimizations and other tweaks. ( Follow this complete 5 steps guide to cloud and hosting for web Apps.)

How to optimize and speed up?

To do this you can use the lighthouse tools that give a in-depth analysis of your PWA and tells everything you need to do in order to optimize your app.

Twimbit.com performance report ( frontend AMP + PWA , backend wordpress CMS, media hosted at S3 served using Cloudfront, Nginx Server and site content through Securi CDN

Ultimately, the better the score > lesser the load time > better User Experience

Conclusion

These question haunted my nights for a very long time. But I needed to be sure when I was responsible for leading tech team at Twimbit ( Our user app Twimbit.com ).

Following is a sample architecture for our web Apps.

I asked myself these questions and came up with quite good idea of developing web apps. There are many challenges on the way but as my coach says -

A good chef focuses on the process of cooking at very micro level, tries to perfect everything and the dish as outcome automatically becomes its best version. Ashish Passi

I will keep adding and updating this article as I get to know more and face more challenges. Contact me if you have other queries or ideas to make this project much better.

Here is the link to my original deck that I present at talk shows.

5 Internships taught me 5 rules of Internships

Aman Sharma — Sun, 16 Aug 2020 08:56:35 +0000

The internship is the first and most important step in one’s career path. It gives a first glance of the work culture and helps in gaining confidence in deciding the right career for you. There would be hardly anyone who hasn’t done at least one internship. But the most important part is finding a good one and then making most out of it. I did 5 internships in 3 college years that too travelling across 13 countries around the world and all self-funded. I can't emphasize enough on what an important role they have played in my life that is helping me in doing my job as CTO of Twimbit. In this read, I would take you along my internship journey through various keystones that one should consider to find better opportunities and make most out of there internship.

1. Source of Opportunity

Internship 1 Fall 2016
Internship project — WEB operations 
Company - Joint EBWA and BPW 
Place - Cairo, Egypt

I have seen many folks wandering around to find a good internship. This shouldn’t be a bigger challenge as there are many platforms which get you matched with a good opportunity. That sometimes becomes a challenge too as you don't know what is the company beyond there Job Description. You should dig deeper about the company as much as you can and ask about it more during your interview round. Also, you should not conflict your interest with too much of this and that and other materialistic bullshit. Always remember it's you who is getting the most beneficial not the company. and your focus should be to work with the right minds who can help you grow. Everyone won’t find an internship at big company like Google and it’s ok to start small. You will learn more at startup and will be given much responsibilities there.

My first internship was through a talent organisation named AIESEC which helps student find internships abroad. I applied for a volunteer opportunity at an NGO named EBWA which empowered women in running their business. I lacked experience at that time hence anything would have been better but working for a noble cause was the best thing. After couple of interviews, I got the opportunity. It was non paid but they would offer accommodation and travel allowances. I collected some money to get the visa and flight tickets and set off for my first travel. I was 17 at that time so my family was worried about travelling alone but everything turned out to be good. During the programme, I not only did some amazing things but also explored ancient Egypt and made many friends.

Nowadays at Twimbit, we hire interns from all around the world through various sources. For us, no platform is better than other and we treat every candidate equally and give them every possible chance to get the best opportunity.

2. A solid reason

Internship 2 
Summer 2017
Internship project — WEB development 
Company - Tommorrow Systems ( IWASSA)
Place - Milan, Italy

The first time I heard the idea of internship it seemed to be fun, like getting to work in an office without actually completing your degree, sounds really cool. Most of my batchmates had to do it for the main reason of adding it there resumes but I, on the other hand, had no idea at first why I was doing it (other than that I get to work in an office 😂 ). But later I realized its mainly to get a glimpse of how your future life would look like. Those folks who are doing it for there resumes ( not to offend them ) would find themselves just passing the time and not learning something real.

I got the proposal to work at Tomorrow systems during my internship in Egypt when I was travelling for a weekend holiday to Dahab which is an island in Eastern Egypt. A stranger sitting next to me helped translate instruction from a security check personnel and later this stranger became my friends who was CMO at IWASSA. He asked me to have an interview with there Tech manager. I took that very lightly at that time and went to have an interview and surprisingly got selected. It was a remote opportunity where I would be paid monthly and often travel to Milan during my College vacations. During the internship, I learnt the important lessons of managing work and delivering things at a time especially because of the remote environment. Some tasks were more challenging but my seniors always helped me and guided me through those tuff tasks. I learnt a lot about serverless, web security, Wordpress development, Hosting etc during the time. Later the company was acquired by Tomorrow Systems and I was lucky to remain the part. I also worked on projects from Sanrios the famous company behind hello kitty.

Fun fact — Sanrio's official website was developed and maintained by me and I also visited the office at Milan which was full of Hello Kitty stuff .

3. The required skills

Internship 3 Fall 2017
Internship project — Front End Developer 
Company - Upsell.ai
Place - Athens, Greece

The most difficult part of getting an Internship is when you don't know much and better the company the higher will be their requirements. At this time it becomes more of a chicken-egg problem when you have to think between learning the skill first and then doing the internship or Doing the internship and learning. In my opinion, it should be a mixture of both. You should continuously work on adding more skills but that is not the only thing a company needs. It should be more about what you desire to do. Companies most of the time look into your style of doing things not expertise in a language or stack. At the same time, you should be ready to take the required tech stack as your next challenge and be open about it during the interview. Most of the time people are kind enough in believing in you and giving you every chance to prove yourself.

I applied for a Global entrepreneur program through AIESEC, this time for Europe ( Just because I wanted to travel more 🤩 ). I applied for multiple companies where everyone’s requirement exceeded my skill set but I still persisted to give it a try. Among them was a company named Upsell.ai which was a hotel and luxury AI company and needed a Front End guy knowing React.js( I, of course, 😂 lied in my application ) and went to have the interview. My interviewer was the founder and CEO himself and the coolest guy I ever met. I was honest about my skills and told other things about me and the interview turned out to be 1 hr of fun call. I got the opportunity and travelled to Athens. Soon I was handed many important responsibilities and made many awesome techs. We use to travel around hotels in Greece and really enjoyed our work. Later the company offered me a job as a UX and AI consultant with a stipend I could never refuse.

4. Not just about work

Internship 4 Summer 2018
Internship project — Research Associate for Recommender Systems
Company - TU Wien, Ecommerce Devision of IT
Place - Vienna, Austria

In the hustle of becoming better and making good profile situations sometimes become really daunting and challenging. When you are not enjoying things that you do, you can’t think creatively and do things at your maximum potential. If you are not feeling good about your project you should talk about it. People mentoring you have a better experience and can always help you in the situation. Self-motivation is also important and it's not necessary that you will get things that you want but you should be ready for any situations and that's what your future life is going to be about. The best thing you can have from your internship period is finding friends and mentors that will remain in rest of your life.

I was doing amazingly good at Upsell but Babis ( CEO of the company) had something more for me. He offered me to be the company representative at a research project that we were doing with the Technical University of Vienna (TU WIEN) . The project was to build a recommender system with AI/ML about which I had no prior knowledge. I went to have the internship and learnt many things about Recommender Sytems, Flask API, CNN, Deep learning and more. This gave me confidence and credibility to go on to build anything that had AI in it for the future.

But one thing that I realized was, more than the technical learning I also did learn about things like people skills, communications, overcoming the tough situations and helping others. These are the lesson I would never learn at home or in books. I now friend from almost all parts of the world and have people to visit for any help.

5. Managing the variables

Internship 5 Fall 2018
Internship project — Startup incubation 
Company - Kievents.co, AIC Bimtech
Place - Noida, India

The path to internship won’t be easy and many obstacles will come along. Most of you must be wondering how did I go for these internships during college time. BIT ( my college ) had the same strict attendance rule like the other colleges. Due to the reason I always fall short of my attendance. But somehow I always found I way with a certificate or an amazing excuse to get pass it. I don't encourage you to go against your college rules but figure out a way to manage both of them parallelly and that's what I exactly did. When you have the right opportunity in hand everyone will support you. And always be open to working remotely with the company, many of them already support a programme like this. The other challenges that may come can be financial. I never depended on my family for my expenses and had a workaround to gather the budget. During my college days, I took freelance projects and saved my stipends for future travel.

Turns out if you have the full will of doing something you will find a way.

My final year internship was actually an incubation at AIC Bimtech. By this time my colleges realized my will power 😎 and didn’t bother me too much about attendance. Later I met other like-minded people and co-founded Twimbit

Conclusion

Most of you won’t be having the same things as I got and sometimes a little luck is also needed. But more than that you need to have the 4 most important things that I have at back my office wall.

I am always excited and happy to help anyone looking for an opportunity or need any guidance. Feel free to connect with me anytime. I hope you found something fruitful from my journey and I wish you luck for the future.