 This is something that we use in Paytm a lot. This is a business rule engine This is it helps keep pace with managers and business ops. How I mean These are the use cases like we are suddenly asked to stop sale in some UP town for You know things which are priced for more than 5,000. This is just for two hours and We get a call that Bangalore has you know having these protests So we delay all the shipments for two days We get these cases where the products greater than 5,000 rupees and Orienting from the States other than Jammu and Kashmir Cannot be delivered in Jammu and Kashmir. So I mean, how do you handle cases like these how we can't do Deployments every now and then we can't put up lookup tables. Maybe we don't know what to do We can't roll out hot fixes every five minutes so What we do is something Which you can see right here We have something called these kind of rules. Now, what are these rules? These rules are nothing but if conditions The conditions are like this for example This is a key if this key is greater than zero and this key is less than 10,000 and this is in this range so and so Then we simply set a variable. I mean, how does that help us? This one better, okay So let me explain a sample rule by opening a terminal Here so For example, this is my a simple JavaScript object, right? And this has like these two three keys Now, this is a simple business rule. It says that This key has to be greater than zero This key has to be less than whatever and this key has to be in this range. This date has to be in this range All of these conditions If they are and and or you can put or or you can put this long conditions Then, you know implement this action, which is just implement just set a variable called one Now, how does this help me this helps when I say When I say this for example, this is this is a screenshot of my live Panel, which says that the destination state is not Jammu and Kashmir and the source is Jammu and Kashmir Then I do not ship Simple, it's it's very very simple. It's very very effective and You know, this saves a lot of deployments for me So, I mean, that's it. You can put tags. You can put caching. You can priority You can do prioritize you can do a lot of things. So That's pretty much it. Thank you Yeah, yeah, I've open sourced it. I have open source it. So please check it out and let me know the joy is also there and Couple of companies I know use it It's obviously not as fast as the native GS obviously. So that's not the debate, but It helps with the dining requirements Thank you, Shreya. Next speaker is Hemant Is he here? Shall we kill? Okay. Next is Shreya Patish. Hello. Yeah No, I don't have any slides Right time starts now Hey guys Time starts now. Okay. Cool. Hey guys. I'm Shreya's and I work at Hasgeek. I Build products if you have booked tickets on our site. I may have had a hand in that So I want to talk about How we go about learning new things, okay? Just a few questions. How many of you have learned or tried learning a new language or a new library this year? Yes, wow, we have an awesome audience. How many of you have started a new project this year from scratch? Okay, awesome. How many of you have started a new project with a new tech stack? Okay, interesting. So how is your experience just in a word frustrating exciting? Not combination combination of both Okay, so I just want to talk about my experience with this third case I talked about about building a new product and using a new tech stack and something I learned from that experience and I Hope somebody I hope you find it useful. So I just want to take you back to 2013. I was working at a startup and Hi on Paul Graham essays and one day I decided to quit my job to start my own thing and I thought I'll make a Site for music teachers to teach music right now as a geek What is the first thing that comes to mind when you decide to build a new product? Exactly the tech stack. Oh, my oh, this has killed this closure. There's all these fancy frameworks What am I gonna use and I spent a week trying to decide the perfect tech stack for my product because this has to be Done really awesome and I picked a new tech stack Which I knew nothing about roll my sleeves and ten days down the line I had made zero progress on the product, right and how many of you have been here Okay, great. So we're on the same page. So let's step back here, right? What's what's 2013 me doing there? Clearly, that's a naive approach and when I step back and looked at it As I realized I was conflating two things here. Okay When we when we are building a new product, what are we trying to learn? We're trying to learn what our customers want. We're trying to learn what the market needs are We're trying to learn for competitors are and so on. This is very different from the technology stack, right? And when we're learning a new technology stack, what are we trying to learn? We're trying to learn patterns We're trying to learn. What are the big ideas in this library? Oh, there's unidirectional data flow Oh, there's you know isomorphic rendering, whatever it is We're trying to learn the big ideas. We're trying to understand. What are the possibilities of this piece of technology? What are its limitations and where does this make sense to use right? So these are two very different set of learning tasks that we have in front of us, right when building a product We're trying to learn about our customers and the problem domain and we're trying to learn new tech We're trying to understand the tech itself and not the problem domain and I try to recollect Whenever I had the few successful experiences I have had when I have shipped a product or when I'm Uh, learning new tech and the one pattern that emerged Was when building new products, I've almost always used boring technology Which which basically means technology. I've been very familiar with Right, so I'm feeling familiar with python and ruby and javascript or whatever and Using familiar tech lets you focus on the problem domain. You're not scratching your head about how a directive Works or how scope works in angular or whatever you're trying to understand the problem domain And that is the most important thing when you're building a new product And whereas when I'm building whenever I'm learning a new tech The most important thing is to pick an easy problem a problem that you're familiar with Like a to-do list or an e-commerce app Maybe you've built an e-commerce app before makes sense to build another e-commerce app With this new piece of technology Makes sense This is this is what I sort of learned and I just thought I'll share it with you I'm really curious about what other approach you guys have figured out and I'd love to talk to you about it outside That's it. Thanks All right, great so, uh I'm gonna talk about developer tools again, right and uh, we talked about performance of user interfaces Uh, performance of our own developer tools is also something that I kind of care about like have recently started caring about Right, uh, how many of you use travis ci or any kind of ci? Just a raise of hands Really, okay, decent graph. Okay, so I'm going to talk about how do you get faster builds with travis ci, right? So travis ci is this tiny little thing. Basically, you'll have some test cases You'll have some validation that you want to run on your code Right and you want to basically get this on your pull request like, uh Yellow like checks running and when this pass you hit merge, right? Now every time I write some code, right and I raise a pull request I see this right and my internal I get a itch of hitting that merge button, right now. I'm done I've tested it myself. I want to hit merge, right? But I have to wait for all my checks to go green and then I can say, okay, let's merge, right? Uh, this is a repo that we have inside practice. So I wanted to focus on that elapsed time This is the time it used to take right four minutes 13 seconds for my itchy little brain to wait to hit that button, right? It was driving me crazy. So Uh, I'm going to talk about some tiny three tips that you can do with your travis builds to make them super fast First of all, don't use sudo if you're doing anything on your setup that requires sudo Find another way, please, right? So when you're not using sudo, what travis gives you now is It's container based infrastructure, right? So it stores your things into docker like images So your builds are super fast because it just spins that up. There's no get clone all of that setup, right? your build starts pretty fast And uh, what you also get in there new infrastructure is dedicated cores and more ram, right? So it's just if you have more process power your test will run faster, basically Right got it down to two minutes 45. Patrick is still not happy, but we're getting there, right? next thing so Uh, another thing travis has which I use in some projects, which is I want to test on multiple node versions, right? So this is useful when you're making npm modules because you don't know where they're going to land up, right? So I test and what travis gives us is pretty cool that you can have three parallel builds, right? Which is running on three different node versions and this is paralyzed. So that that is pretty cool Another tiny hack, which is pro tip two is you can treat it the same way by giving three environment variables, right? So I say that Test suit is my environment variable and I say integration slash appointments integration slash descriptions, right? So these are my three different test suits and because I've defined them as environment Now I can run these as three different even though they're the same thing like the same code base same environment But I can run them in parallel. So this is a pretty cool hack that had parallel suits, right? Got it even faster one minute 36 seconds, right? Last tip tip number three is cache your dependencies So travis gives you a way of caching your dependencies. You can cache node modules while components Just tell it the directory and when something like when your package or json changes It will just install the diff, right basic cache, right? So if you cache all your dependencies, it's even faster It got it on to 47 seconds, right? Which is super cool for uh, pietrick, right? If you're using travis ci or if you're using any other ci These three things actually hold true for all ci even if you're using Jenkins or circle uh containerize Cache everything you can and try to make it as parallel as possible, right? If you have any more tricks I kind of I'm stuck at 47. I can't bring it better if you have any tips Catch me on my twitter or talk to me outside. Thank you Next up amit kapoor Okay, how many of you use markdown? Okay, as developers i'm guessing a fair bit and How many of you would like to do visualization using markdown, right? Okay, a few hands. Okay, great So in the morning there was a talk by kurran and he talked about a lot of the libraries that are there to do visualization and One of the hardest thing about doing visualization is if you want to learn something like d3 for example It's very imperative. You have to describe what it does Uh, there are a number of instructions on top of that which help you write it simpler and one of them is legalized Which has a grammar of graphics built into it or a grammar of interactive graphics So i'm in legalized. So this is just a Implementation which we just did right now in js foo. So it's a hack done in js foo and with treas and with yeah, so The hasgi guy is helping kind of put this together The idea is basically you write markdown as usual and you have a code block on the left And You write your code with simple The graphics like you would write code and instead of any language you just say it was so v is and And then you just give a very basic specification which is Data in this case. There's a data set we're using which is cars dot csv We're using describing everything through point and we want x and y to show And x in this case is kilometers per liter and y is price So this is a price versus kilometer per liter for all cars in the under About 10 lakhs and you just give the spec and you have a chart that you have that comes to the right Very simple. You just write the visualization in markdown And you could do something more complex and describe much more and you could Get more like a bubble chart with fix everything In this case, I guess you can write Yeah, this is much better With four variables in this case price and kilometer per liter and then y and x type Which is hatchback and sedan and horsepower as the size of the circle, right? So you just write Specification on the left and you can get it to the right You can you You can use it in part of your documentation It just does take it use it uses yamel converts it into json which converts it into weight light Which is the specification on the right Thank you so much And it's available at wis down dot amit caps dot com if you want to I just tweeted it out And the code is on github Subit here Hello everyone, the theme for this j s who is performance and speed And what better way to cap it off than speaking about assembly? Well, a couple of years ago The mention of assembly would have been frowned upon in a conference about Chauer strip. How times have changed? Haven't they? I think java strip started off as a language Which solved critical features like Pointer trails mouse pointer trails revenue impacting Stuff like popping up advertisements But we have come a long way since then over the last Decade or so especially we have pushed java strip to its very limits And we always need more performance and more speed We came up with something called asm js a while back, which is strictly speaking a subset of java strip It's kind of an optimized instruction set. But again, it is java strip. It's not a new language. It's just a subset And it performs really well If you compare it to native code it gets as close as 2x only 2x slower than native performance And it's a text format So you can actually hand code Asm js though, I wouldn't recommend it But if you really want to debug or test something or view the source in asm js, that's possible But again, we hit the ceiling with asm js again in June 2015 A w3c web assembly group was created and the participants included Google, microsoft, apple and mozilla among others They proposed a standard called web assembly or web And their aim was to build a native compile format for the web browser Now strictly speaking, this will be a native compile format for java strip engines So it may in future work outside the browser as well But the target for now is the browser Now the design docs and code is all on github I hope this is visible And wasm is supposed to be an open standard unlike plugin extensions like silo light and flash The main problem with nervous was they were closed and they were an entirely different code base from your basic java strip engine So this is very unlike silo light or flash And it's going to be completely open source So obligatory flash bashing check And it's going to be native speed So it will be up to two times faster than asm js And experiments have shown that it can run as fast as 20 times faster than plain java strip One concern with flash and similar platforms was safety Now wasm is something which is being built to be inherently safe It has checks for same origin policies and memory leak checks So you won't be able to do anything outside the sandbox environment of your v8 engine And let me clarify about the term native here when you speak of when you hear the word native You think it's something to do with which is running directly on your hardware Now this doesn't exactly mean you're running you're directly accessing the bare metal This is native format for your v8 engine, which already is within a sandbox So this doesn't mean you will have access to different hardware or proprietary APIs It's up to the implementation to provide them But the standard says you must maintain portability across different hardware platforms Now what we may use this for there the possibilities are endless Of the top of my head I can think of games Augmented and virtual reality applications scientific simulations CAD 3d designing any blender users in the house. I mean not in the kitchen Here we have one. Okay, so if you are into 3d development or game game engine programming This can be a very good Use case for using web assembly Now the fun part is it's been barely a year since this proposal was initiated But you can use web assembly today in your browser The latest browsers chrome and firefox and surprisingly microsoft edge Support web assembly. They have experimental support and yeah microsoft edge. You heard it right So obligatory snide remark about internet explorer slash microsoft check Now whism has a Shell called binarian Which is again on github. You can clone the repo and build your own binarian binaries Now a fun fact here for the game of throne lovers binarian is actually supposed to rhyme with targaryen And the tagline for binarian is code and bugs The house words of targaryen if I remember correctly are fire and blood Okay obligatory go t comment check Now the two binaries provided by binarian are asm to wasm which compiles asm js into wasm text format And the wasm as compiles the text format to buy a wasm binary An important point which I missed was wasm is not just a binary format But it has a compatible text format, which is human readable and editable as well. Let me quickly jump into a code demo Is this readable enough? Okay. Now. This is something I wrote in asm js This is a fairly complicated maths library. It gives you the square of an integer And I'm calling it out from here Basically what it does is it produces the square of the number and it Echoes onto the console the function as well as the result Let's see the result here. After all the react and UI stuff. I was able to build this Fairly complicated UI Trust me. I am a frontend engineer So I I have two versions one using asm js and one using wasm This is the function and this is the output now. Watch when I click on wasm You see this part. This is native code Now this is where all the difference comes in now, of course We can benchmark this and find out the difference in performance, but that's out beyond the scope of this talk Let's go back here Absolutely Yeah, yeah This is the asm js code This is the readable text format of wasm, which is was t And this is the binary format And to cap it off, uh, we have a playable demo which was built by The wasm team, uh, which you can watch me trying to play and struggle Okay, but this is a proof of concept that wasm works and works as of now as of today. This is just a chrome version 53 and Let me see about flag Yeah Yeah, this is this is the flag which you'll have to enable if you want to try this out So that's it. Uh, all this code this complicated code is On my github if you are willing to fork it and make it even more awesome And I'm available on twitter not very active, but if you would like to drop me a message Please feel free to do so. And if you are building anything using wasm, I would like to know. Thank you very much Hello Okay, okay, uh, how many guys are you using graphql or like Sorry, so this talk is more about why to shift to graphql or why to invest into graphql Uh, so I'm going to focus on that, uh, not too about how to use it. Uh, so first of all, uh This is in our rest scenario. Normally we make some requests and uh This this is some familiar like like this is some rest api where we are hitting a user and we are requesting user by its id And our server will resolve that request and it sends Makes us like some json or something like that. Now if you decide to let's Change something in our view or let's add new feature to users. So what we do uh We create some new versioning in our api or We pass some parameters After the api and it will sense us New users like new version of the user So basically, uh, we are going to duplicate our all the code For this part like we are going to duplicate the entire code operation which is happening into the user api Uh, that's the one point. Uh, sorry. That's the first point Then let's say we are making a request and that request returns some sort of json and that json contains some sort of uh More keys or more arguments which we are going to pass again With like here i'm passing the Like hitting the events and i'm getting the events by id So the event has id name and location and there is a attendees field So attendee has an array of user ids and those user id again If you want to load all the user id who is going to attend that event We're going to hit uh multiple like we are going to make multiple Uh, sorry Request to the server and it's like we are going to make multiple round trips and If you are in a like Mobile network the round trip are really like closely. So this is the second point Okay, so Would like this is how graphql looks like and In the both of the scenario the first and second we are actually tightly couple our Views with our models on the server. So whenever we want to change something into our views We are like how to specifically change something into our like server sidecode and Here i'm making a request to the my graphql server And this is what request looks like like i'm specifying the user and i'm specifying the fields that I want to display on that view and it is going to Return me the exact thing that i requested like i need just a username and Fiti nothing else nothing more now i'm making the second request At that time i'm in this request i'm adding uh email also and uh server is going to uh give me email into my view so How graphql works and uh What it is actually uh, there is a misconception like the graphql If you want like it's like a query language like it works with the Graph databases or it's like graphql. It's like another query language like sql or something like that But graphql. It's uh, just like a set of specs which is uh You can implement with any code base or any storage engine So basically there is a data source and okay, sorry Are there is a data source you can put your graphql server onto any data source And whenever you make some request it goes through the graphql, uh server and it Which is the same data If we break down the graphql into Furthermore, so this is the graphql 4. Okay. I have very less time. Uh, let's first Graphql core type system and application code. So application code. It's like where you are making uh operations like where you are interacting with your Data source and type system is where you define that what you actually want to fetch or like what is the That object would look like And core it's like managing all the stuff which has all the apis which you are Which we can use. So this is what type definition looks like in the graphql in that Uh, I'm just going to give you a real quick demo Very fast. So basically this is a graphql, which is also created by like the guys who created. I mean facebook. So it is GUI for making a graph queries And uh, if we like if you see here So there is a root object called movies and I'm just asking for ids and it's going to give me the ids Now if I add, uh, I have also title fills So if I do something like title, so it's going to return the title. So right now, there's like no tightly couple thing between Our views and our server and if you add like if you remove the stuff like this, like So it's like what you are requesting. That's the only just that's the thing you are going to get So there is no over fetching. There is no under fetching and It's going to really improve the like it's really going to improve the performance Okay, uh, thank you if you like really want to see something else, uh, just great Hello, so Yeah, yesterday I saw I gave one of I don't know one of the class and I was a little nervous yesterday as it was my first first and today I'm feeling a little better so How many of you have uh, have you used socket i o? awesome, so Okay, I'm gonna talk about my experience and like the problems I got into while I was using socket i o at for for one of my, you know, like, uh Yesterday, I mean I did mention about the ray calendar, right? So to Instead of pulling so we were using socket i o to you know in order to get the appointments While two or three receptionists are you know, like adding or deleting the appointments at the same time So, yeah, as most of you are aware of whenever you initiate a The connection request from your browser to a socket server it generally uses A transport called polling and then if the browser supports and then if your engine x is replaying back And like sending the header saying upgrade then it will upgrade to web socket with that since, you know, like We had thousands of practices which used to which used to get connected to My web my web socket server It used to you know, like throw a http error with the response code saying 400 like it's a bad request, right? So generally each polling HTTP request will have a socket id along with the timestamp And whenever it gets disconnected, it will keep on polling. It will keep on trying to reconnect again and again So with that I used to have around five to six percent of error rates during the peak time And so I actually Cool I'll just side this It Yeah, so when we had uh, I mean like during the peak peak because it I used to have four to five five percent of error rates And then a response time as well. It used to be around somewhere around 120 milliseconds And like we just debugged it for Two to three weeks and then we realized Some of the browsers which will never get upgraded to web socket from the polling transport Uh, because of the outdated versions like some of the doctors They they they never used to upgrade their web browsers, right? Because that's that's not their job. So and then tk I I I kind of Uh thought of this way so instead of Trying to connect. I mean trying with the Transport called polling. Let me try with the transport called web socket because if you look at If you if you look at, uh, I mean like uh support for web sockets in all the browsers, right? So Most of most of our browser supports Web sockets and then I I did this way So I use I first try with the web socket if the browser don't support then I fall back to polling With that I could achieve So yeah, august 10th is the time when I actually did this hack and since then I had I pretty much 0% of errors. So I never I never had errors and then kind of they there there would be some Uh, one or two errors. So I'll go go to a detail view Okay, so if you see some of the errors which happens now and then right so Uh, those are the browser I mean like requests which made from the old versions of browsers Which don't have support for web sockets Cool. That's it. Supreet here. Last speaker is one see. Uh, hi everybody. This is one see uh A back-end developer from practice So how many back-end developers are here? I don't see any Uh, I just I'm not feeling left out right now So I'll tell you a funny story. Uh, we went to a recent hackathon. Okay, and uh Our team consists of consisted of four people three back-end developers and one under developer so Three back-end developers. I mean, I mean we didn't have a front-end developer So we went there, uh, we built this calling service I'll tell you an example of it. So if you start up like, uh, let's say Example of zoom car it wants to enter a tire to city where it's not there So it wants it comes to us and says, uh, I have four questions Please get these out. Please get the answers from the users in my store or some other city so we Give our service as a calling service. I mean to the user So user will call us. I mean give a miss call and then we call them back and then ask the four questions So user gets recharge for answering questions. His mobile will be reached for that So everything was done. Uh, our hackathon project just completed So then we had to realize that company needs to see somehow how many users have called How what was their answer? Etc. That's when we realized that we actually needed a front-end developer And then uh, so we had to build some dashboard where we can do that So essentially we just needed some charts where we can display some statistics So by just googling and etc. We were We happened to build this probably I don't know if it's good or not But I'm really proud that we actually, you know managed to build this this, uh I spent I guess five or six hours in that five and a half hours. I was just searching on the internet for a readymade code So I was back at I mean back. I mean I am a back-end developer. So after that we managed to build this So it's really interesting. I must say because uh I just had to search and write some very small lines of code to uh, complete this So this is the 3.js. So these are the questions. I really love this part I know you guys are friends and developers and this is not a big thing for you I love the way it changes I like that so So all I had to do was write this much code Which is pick up my margin pick up my width height And select a div from html. I wrote the html 2 by the way So and give my scale that is ordinal or linear Ordinal is just uh, it says that fixed uh, like this They're fixed Hatchback sedan and suv and these are uh scales which can you know, there is something between seven and six. So This is the difference. It's linear. This is the vice y axis is linear and x axis is uh, ordinal So once I define the scale, I just have to draw and then use this uh svg element and then use translate so I give the x and y coordinates to translate and uh That's how I happen to achieve this part This and then we managed to also draw get the code of pie chart. I didn't get the whole code I got the code and I managed to put my data into it and uh, modify it according to my needs. Thank you One more speaker who was supposed to be the second speaker. This is him He was downstairs running the bof Yeah, sorry guys, like I was uh downstairs doing the birds of feather for progressive ababs I feel lucky enough to see a couple of At least decent number of people here Wait It's a sink of eight. Yeah, so how many of you have heard this feature called a sink of eight Three guys so apart four guys apart from you guys like I can speak anything. I guess just kidding So I want to talk about this blog post. I wrote about like in 2015 A simple use case. I wrote a node model called xkcd images The whole purpose of this node model is to fetch a random xkcd image How many of you xkcd? Like I've just got like four minutes. Anyways, like yeah, doesn't matter xkcd is that cartoon thingy Which explains complex com science and science So so if you see this should I bump up my phones or is it fine? Okay Yeah, oh, so I don't see my flux Yeah So uh, uh, so I require xkcd module as I do for any node module and then I call xkcd dot image I I get a callback with error and result as normally the node style of callback with error and result If there is anything in the result like I would just print the result and the result would be the Random image from xkcd nothing high fund I bought this This is the normal kind of a node callback style pattern, which most of us would have used And we saw that we did return something Then like there come an era of promissifying things like you promissify this module Promissify is this simple module that Makes this callback a promise. So so most of us are aware of promise, right? It's like a function that results to a value later somewhere in the timeline of the execution, right? So I make a promise out of this and then you see the magic keyword here called await. So that is the async await Of a spec which gives these await keyword. So you could do an await on a promise and I'm console logging await xkcd I'm not doing xkcd dot then function And then dot can dot catch and catch like how do you normally resolve a promise? I'm just saying await and you saw that the result was an object which had an image in it as before As the previous one also had right so So if you see at the uh, if you have a look at the xkcd images module it is nothing but it's using the request module and doing an Request to this url which returns a callback with error response and body Right and and if the response status code is 200 that means it's okay. Everything is fine We will have the body the body contains the json which has the uh image info and the image url, right? now if I if I make this uh Entire thing a promise if I request that's what I'm doing here like request promise if I and then pass in the url That that returns me a promise. That's like your fetch API that what we use today and and If I run the code I'm doing a json dot pass. I wait off the promise, right? So the what I feel is 2017 would be the year where we would write javascript Like sync, but it will run like a sync All our async code will look like sync like we just look like sync, right? If you see this, you don't see any callback or anything, right? But it runs like a sync. That's what I feel 2017 would be So there is this uh Fetch for node. It's uh rather I would replace this with isomorphic fetch So fetch for node basically fetches and returns a promise. So what I'm doing is I'm saying await await and fetch has this wonderful API called dot json that would do the passing for me So I would say await fetch which gives me my promise and then I would say await That promise dot json. So so finally I would get the result. So let us like take this as json I have like one minute left And I will like console log json So I run this It's hitting the server Yeah, so we got the result. We got some wikipedia virus info So basically we reduce the entire module to a single line which looks like sync but runs like a sync So I have await await fetch url dot json. So to prove it that it runs like a sync. I would do a console log um say meow here Right and then run this again I got meow and then I got the url if you could notice it is asynchronous in behavior, but looked like synchronous when you read the line So this is async await, but so far if you notice I've just been talking about await There's there's this simple example I would like to give on how async would work like so you write a normal function as if you would write it in Any means like just a function But add an async keyword at the beginning of it saying that this is an async function That means you you you would use await somewhere within the function. So you're using await here This is like fs one of the modules I wrote that is a fs wrapped around with promise like promissified fs And then you would fs dot redirect to that and you would say await So your list would have all the contents of the directory in tilde slash right So that is a quick demo of async await in five minutes. And this is how es 2017 would look like And if you want to know more such features of what would es next look like you can just go to get get Get dot ios slash es next and we have all the stage one zero for four five all the proposals zero to four Stages all the proposals are there and if you want to know the features of es6 and es7 as this is a progressive web app So you could just hit gs features dot in and add this to your home screen And you have es6 es7 and You could just link this and you could share this link to your say suppose you want to Show classes to somebody it's like linkable you can give it to them and it's a progressive web app So advise you to add it to your home screen. That's it. Thank you guys