Spec-Driven Development and the Future of AI IDEs with AWS’s Kiro - JSJ 693

JSJ 272: Functional Programming and ClojureScript with Eric NormandThis episode of JavaScript Jabber features panelists Aimee Knight and Charles Max Wood. Special guest Eric Normand is here to talk about functional programming and ClojureScript. Tune in to learn more![00:1:14] Introduction to Eric NormandEric works for purelyfunctional.tv. The main target market for his company is those people who want to transition into functional programming from their current job. He offers them support, shows them where to find jobs, and gives them the skills they need to do well.[00:02:22] Address that quicklyFunctional programming is used at big companies such as Wal-Mart, Amazon, EBay, Paypal, and banks. They all have Clojure but it is not used at the scale of Java or Ruby.  So yes, people are using it and it is influencing the mainstream programming industry.[00:3:48] How do you build an application?A common question Eric gets is, “How do I structure my application?” People are used to using frameworks. Most start from an existing app. People want a process to figure out how to take a set of features and turn it into code. Most that get into functional programming have development experience. The attitude in functional programming is that they do not want a framework. Clojure needs to be more beginner friendly. His talk is a four-step process on how to turn into code.[00:05:56] Can you expand on that a little?There are four steps to the process of structuring an application.Develop a metaphor for what you are trying to do. Developing the first implementation. How would you build it if you didn’t have code?Develop the operations. What are their properties? Example: will have to sort records chronological.Develop relationships between the operations.Run tests and refactor the program. Once you have that, you can write the prototype.[00:13:13] Why can’t you always make the code better?Rules can’t be refactored into new concepts. They have to be thrown away and started completely over. The most important step is to think before beginning to write code. It may be the hardest part of the process, but it will make the implementation easier.[00:17:20] What are your thoughts on when people take it too far and it makes the code harder to read?He personally has written many bad abstractions. Writing bad things is how you get better as a programmer. The ones that go too far are the ones that don’t have any basis or are making something new up. They are trying to be too big and use no math to back up their code.[00:20:05] Is the hammock time when you decide if you want to make something abstract or should you wait until you see patterns develop?He thinks people should think about it before, although always be making experiments that do not touch production.[00:23:33] Is there a trade off between using ClojureScript and functional JavaScript?In terms of functional programming in JavaScript don’t have some of the niceties that there are in Clojure script. Clojure Script has a large standard library. JavaScript is not as well polished for functional programming; it is a lot of work to do functional programming it and not as much support.[00:27:00:] Dave Thomas believes that the future of software is functional programming. Do you agree?Eric thinks that it seems optimistic. He doesn’t see functional programming take over the world but does think that it has a lot to teach. The main reason to learn functional programming is to have more tools in your toolbox.[00:31:40] If this is a better way to solve these problems, why aren’t people using it? There is a prejudice against functional programming. When Eric was first getting into it, people would ask why he was wasting his time. Believes that people are jaded. Functional programming feels foreign because people are used to a familiar way of programming; they usually start with a language and get comfortable.[00:40:58] If people want to get started with it, is there an easy way in? Lodash is great to start replacing for loops. It will clean up code. There are other languages that compile to JavaScript. For example, Elm is getting a lot of attention right now. It is a Haskell like syntax. If you want more of a heavyweight language, use TypeScript or PureScript. ClojureScript is into live programming. You are able to type, save, and see results of the code immediately on the screen in front of you.PicksAimee:The Hidden Cost of Abstraction What Functional Language Should I Learn EricSteven King, On Writing Youtube Channel: Tested   CharlesIonic FrameworkLinksPurely Functional TV Blog Building Composable Abstractions Special Guest: Eric Normand. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

1 Elo 201749min

JSJ 271: SharePoint Extensions in JavaScript with Mike Ammerlaan and Vesa JuvonenThis episode is a live episode from Microsoft Build where AJ O'Neal and Charles Max Wood interview Mike Ammerlaan and Vesa Juvonent about building extensions for SharePoint with JavaScript. [00:01:28] Mike Ammerlaan introduction Mike has worked at Microsoft for a long time on multiple Microsoft products and projects. He's currently on the Office Ecosystem Marketing Team. [00:01:52] Vesa Juvonen introduction Ves a is Senior Program Manager for the SharePoint Splat team. He's been with Microsoft for about 11 years and manages the community and documentation for the SharePoint framework. [00:02:18] What is the SharePoint Framework? This is how you write SharePoint extensions with JavaScript. SharePoint has changed. It now works with common modern development tools and web development techniques. SharePoint consolodates the extension effort [00:03:32] What is SharePoint? File sharing, team sites, communication points for teams. Part of Office 365. You use Web Parts to add functionality to SharePoint. Web Parts provide functionality like widgets and are scoped to a team, group, or set of users. It's usually hosted on premises, but you can also use it with Office 365 as a hosted solution. [00:05:56] What extensions can you build for SharePoint? You can build widgets for your front page or intranet. You can also add user management or data management or document management.Examples:DashboardsMini ApplicationsScheduling and Time TrackingDocument StorageSource code repositories [00:07:39] What is WebDAV and how does it relate? WebDAV is a protocol for accessing documents and SharePoint supports it among other protocols for managing documents. [00:08:36] Do I have to build front-end and back-end components to get full functionality? You can build the front-end UI with Angular and other frameworks. And then build a service in Azure on the backend. The backend systems can then access Line of Business systems or other data systems.It really does take multiple skill sets to build extensions for SharePoint. [00:11:10] SharePoint on Mobile There is a mobile web app and the Web Parts work through the mobile application. You can also use any browser to connect to the application. [00:12:08] Building extensions with standard Angular or React component libraries There are standard Yeoman templates. You can also pull in the components through React or Angular just like what Microsoft does.Newer Angular versions are designed for Single Page Apps and SharePoint isn't necessarily set up to work that way. The Web Parts are isolated from each other and Angular requires some workarounds. [00:14:30] Getting around sandboxing Google and Microsoft are talking to each other to see how to work around this when there are multiple sandboxed applications that can't talk to each other in very simple ways. [00:15:39] Application library or naming collisions if my UI uses different versions or clobber page wide settings There are guides for a lot of this. React does a bunch of the isolation work.Addons are iframed in and an API token is given to grant access to the data and APIs.Microsoft also reviews and approves plugins. [00:18:30] How do you get started and make money at this? Look at the SharePoint store. You can build things through websites and pages and offer the plugins through the store.You can request a SharePoint tenant installation from the Microsoft Dev Tools for free. Then you can build into the tenant site. The rest of the tools are available on npm.SharePoint Developer Tools [00:22:13] Automated testing for SharePoint extensions Unit testing is built in for JavaScript. Testing the UI's require you to sign into Office 365. There are people doing it, though. [00:22:54] Building internal-only extensions SharePoint is an enterprise tool, so a lot of enterprises may not want to install extensions from the store. You can definitely build and install private plugins for SharePoint setups. They also have their own backend systems that will require custom development. [00:25:50] Office 365, SharePoint, and OneDrive Office 365 is used by people across many different sized organizations and SharePoint is much more enterprise. Office 365 tools store files and information in SharePoint.What about OneDrive versus Sharepoint? OneDrive is focused for one person. SharePoint is focused around a team. But they have the same APIs and use the same technology stack. [00:29:05] The history and future of SharePoint It started out on premises and has moved to the cloud. The SharePoint team is working to keep it available and useful in the modern cloud based era. [00:30:25] What does the API footprint look like? It spans modifying lists, data objects, attributes, items in a list, put Web Parts on a page, modify the experience, and manage and modify access, users, and documents. SharePoint is a way of building a way of conveying information.SharePoint is layers of data and scopes. [00:35:26] Tutorials and Open Source dev.office.com The Sharepoint framework is not open source yet, but they're working on that. They also need to open source the Yeoman templates. Open source samples are available at  github.com/sharepoint.PicksCharles Max WoodBlueTickZapierScheduleOnceMoo.comAdvice: Take the time to go talk to people. Vesa adds that you should go to a session that's on something completely outside your experience.AJ O'NealThe CircleSpontaneity/Happiness: AJ tells a story about a woman he saw running through sprinklers.Oh the places you'll go by Dr. Seuss: AJ talks about a journal entry he read at a yard sale.Mike AmmerlaanSuper hot VR on Oculus RiftVesa JuvonenFamilyA big thanks to Microsoft, DotNetRocks, and Build!Special Guests: Mike Ammerlaan and Vesa Juvonen. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

25 Heinä 201754min

JSJ 270 The Complete Software Developers Career Guide with John SonmezThis episode features a panel of Joe Eames, AJ O’Neal, as well as host Charles Maxwell. Special guest John Sonmez runs the website SimpleProgrammer.com that is focused on personal development for software developers. He works on career development and improving the non-technical life aspects of software developers. Today’s episode focuses on John’s new book The Complete Software Developers Career Guide.Did the book start out being 700 pages?No. My goal was 200,000 words. During the editing process a lot of questions came up, so pages were added. There were side sections called “Hey John” to answer questions that added 150 pages.Is this book aimed at beginners?It should be valuable for three types of software developers: beginner, intermediate, and senior developers looking to advance their career. The book is broken up into five sections, which build upon each other. These sections are: - How to get started as a software developer - How to get a job and negotiate salary - The technical skills needed to know to be a software developer - How to work as a software developer - How to advance in careerIs it more a reference book, not intended to read front to back?The book could be read either way. It is written in small chapters. Most people will read it start to finish, but it is written so that you can pick what you’re interested in and each chapter still makes sense by itself.Where did you come up with the idea for the book?It was a combination of things. At the time I wanted new blog posts, a new product, and a new book. So I thought, “What if I wrote a book that could release chapters as blog posts and could be a product later on?” I also wanted to capture everything I learned about software development and put it on paper so that didn’t lose it.What did people feel like they were missing (from Soft Skills) that you made sure went into this book?All the questions that people would ask were about career advice. People would ask things regarding: - How do I learn programming? - What programming language should I learn? - Problems with co-workers and boss - Dress codeWhat do you think is the most practical advice from the book for someone just getting started?John thinks that the most important thing to tell people is to come up with a plan on how you’re going to become educated in software development. And then to decide what you’re going to pursue. People need to define what they want to be. After that is done, go backwards and come up with a plan in order to get there. If you set a plan, you’ll learn faster and become a valuable asset to a team. Charles agrees that this is how to stay current in the job force.What skills do you actually need to have as a developer?Section 3 of the book answers this question. There was some frustration when beginning as a software developer, so put this list together in the book. - Programming language that you know - Source control understanding - Basic testing - Continuous integration and build systems - What kinds of development (web, mobile, back end) - Databases - SequelWere any of those surprises to you?Maybe DevOps because today’s software developers need to, but I didn’t need to starting out. We weren’t involved in production. Today’s software developers need to understand it because they will be involved in those steps.What do you think is the importance of learning build tools and frameworks, etc. verses learning the basics?Build tools and frameworks need to be understood in order to understand how your piece fits into the bigger picture. It is important to understand as much as you can of what’s out there. The basics aren’t going to change so you should have an in depth knowledge of them. Problems will always be solved the same way. John wants people to have as few “unknown unknowns” as possible. That way they won’t be lost and can focus on more timeless things.What do you think about the virtues of self-taught verses boot camp verses University?This is the first question many developers have so it is addressed it in the book. If you can find a good coding boot camp, John personally thinks that’s the best way. He would spend money on boot camp because it is a full immersion. But while there, you need to work as hard as possible to soak up knowledge. After a boot camp, then you can go back and fill in your computer science knowledge. This could be through part time college classes or even by self-teaching.Is the classic computer science stuff important?John was mostly self-taught; he only went to college for a year. He realized that he needed to go back and learn computer science stuff. Doesn’t think that there is a need to have background in computer science, but that it can be a time saver.A lot of people get into web development and learn React or Angular but don’t learn fundamentals of JavaScript. Is that a big mistake?John believes that it is a mistake to not fully understand what you’re doing. Knowing the function first, knowing React, is a good approach. Then you can go back and learn JavaScript and understand more. He states that if you don’t learn the basics, you will be stunted and possibly solve things wrong. Joe agrees with JavaScript, but not so much with things algorithms. He states that it never helped him once he went back and learned it. John suggests the book Algorithms to Live By – teaches how to apply algorithms to real life.Is there one question you get asked more than anything else you have the answer to in the book?The most interesting question is regarding contract verses salary employment and how to compare them. It should all be evaluated based on monetary value. Salary jobs look good because of benefits. But when looking at pay divided by the hours of work, usually a salary job is lower paid. This is because people usually work longer hours at salary jobs without being paid for it.What’s the best place for people to pick up the book? simpleprogrammer.com/careerguide and it will be sold on Amazon. The book will be 99 cents on kindle – want it to be the best selling software development book ever.PicksJoeWonder WomanAJThe AlchemistCharlesArtificial Intelligence with PythonJohn Algorithms to Live by: The Computer Science of Human Decisions Apple Airpods LinksSimple Programmer YoutubeSpecial Guest: John Sonmez. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

18 Heinä 20171h 1min

JSJ 269 Reusable React and JavaScript Components with Cory HouseOn today’s episode of JavaScript Jabber, we have panelists Joe Eames, Aimee Knight, Charles Max Wood, and playing the part of both host and guest, Cory House. Encourage your team to investigate reusable components, whether that’d be React, Angular, Vue, or Ember. Tune in![00:01:35] – OverviewWe can finally write reusable components that it is really lightweight. It doesn’t take much framework-specific code to get things done.Around 3 years ago, the idea of web component standard was all front-end developers could share our components with each other whether someone is in Angular or React. Web components continue to be an interesting standard but people continue to reach for JavaScript libraries instead – React, Angular, Vue. [00:04:50] – Browser support issueThe story in JavaScript libraries is easier. You have more power, more flexibility, more choices, and get superior performance, in certain cases, by choosing a JavaScript library over the standard right now. If you try to use the web components standard, you have to Polyfill-in some features so you can run things across browser. You also won’t get JavaScript features like intelligently splitting bundles and lazy load different components.Whether you’re in Angular or React, you have this model of putting your data in your curly braces. That setup is non-existent in standardized web components. You have to play the game of putting and pulling data into and out the DOM using DOM selectors. You actually take a step backward in developer ergonomics when you choose to leverage the platform instead. [00:07:50] – Polymer The reason that Polymer is useful is it adds some goodness on top of web components. One of those things is that it makes it easier to bind in data and not having to do things like writing a DOM query to be able to get your hands on this div and put this text inside of it. With Polymer, you can do something that feels more like Angular, where you can put in your curly braces and just bind in some data into that place. Polymer ends up adding some nice syntactic sugar on top of the web components standard just to make it easier to create web components. Polymer is also used to bundle in Polyfill for the features across browser.   [00:14:20] – Standards are deadNo. The standard itself has been embraced at different levels by different libraries. What you can see for the near future is popular libraries leveraging pieces of the web components platform to do things in a standard-spaced way. Effectively, Angular, Vue, Aurelia, are going to be abstractions over the web components standard. Arguably the most popular way to do components today is React. But React completely ignores the web components standard. When you look at React, you can’t see what piece of the web components standard would fundamentally make React a better component library.Cory can’t seem to run to anybody that is actually using the standard in production to build real applications. People continue to reach for the popular JavaScript libraries that we so often hear about.[00:17:05] – Libraries making reusable componentsThere is a risk that it would have been a waste for people writing components on Angular, for React, for Vue. But it’s not necessarily safer writing on the web component standard when you have so few people leveraging that standard. There’s always the risk that that standard may shift as well.As an example, Cory’s team created approximately 100 reusable components in React. If they end up moving to a hot new library, the components are really just functions that take parameters and contain HTML. There is little there[00:21:20] – Why opt for reusable componentsReusable components are inherently useful in a situation where you’re going to be doing something more than once. If you think about any work that you do as a software developer, we’d like to think that we’re coming in and creating new things but often it is groundhogs day. There are all sorts of opportunities for reuse.As a company, we want to encapsulate our forms in reusable components so it’s literally impossible for our software developers to do something that goes against our standard. That’s the power of reusable components.  [00:31:20] – Rigid component vs. flexible component As component developers, if we try to create a reusable component in a vacuum, bad things happen. If you’re going to do a reusable component, start by solving a specific problem on a given application. If we think that a component’s going to be useful in multiple places, we put it in a folder called reusable right there in our application source folder.We try to follow that rule of three as well. If we’ve taken that component and used it in 3 places, that’s a good sign that we should extract it out, put it in our NPM package, that way, everybody has this centralized component to utilize. At that point, it has been tested. It’s been through the fire. People have used it in the real world in a few places so we can be confident that the API is truly flexible enough.Be as rigid as you can upfront. Once you add features, it’s really hard to take features away. But it’s quite easy to add features later. If you start with something rigid, it’s easier to understand. It’s easier to maintain and you can always add a few more switches later.[00:36:00] – Reusable componentsThe reason that we can’t reuse code is every time a new project comes up, people are spending up their own ideas rather than leveraging standards that should have been put in place previously.We’ve had the technical ability to do this for a long time. We just haven’t been around long enough for consolidation to happen, for standardization to happen. You look at how quickly things are changing in our industry. For instance, a couple of years ago, everybody had pretty much decided that two-way binding was the way to build web applications. And then, React came along and shook that up. So today, you have different ways of thinking about that issue.[00:42:45] – Component development on teamsAimee’s team has component development and they’re using Angular 1.6. All of our base components are sitting in a seed application. We just go in when we want to create a new property and we just extend all of those components with specific functionalities that we need.[00:47:45] – Mobile to web crossoverCory’s team is creating React components but it’s not leveraged on a mobile application. But people use React Native components on the web. And in fact, if you use create-react-app today, you can do that right now. It’s wired up to work in React Native components. In that way, you can literally have these same components running on your Native mobile apps as you do on your web application.[00:50:00] – ChallengeCory’s challenge for everybody listening is sit down with your team and have a quick conversation about whether you think components make sense. Look back at the last few months of development and say, "if we have a reusable component library, what would be in it? How often have we found ourselves copying and pasting code between different projects? How much benefit would we get out of this story?"Once you’ve realized the benefits of the component model, both in the way that makes you think about your application, in a way that it helps you move faster and faster over time, I really think you won’t go back to the old model. I’d encourage people to investigate reusable components, whether that’d be React, Angular, Vue or Ember.PicksCory HouseCreating Reusable React Components on PluralsightTed Talk: Why You Should Define your Fears Instead of Your Goals by Tim FerrissJoe EamesUI-RouterPersistenceAimee KnightAsk HN: People who completed a boot camp 3+ years ago, what are you doing now?NgAtlantaCharles Max WoodUpwork.comJSJ 269 Reusable React and JavaScript Components with Cory HouseOn today’s episode of JavaScript Jabber, we have panelists Joe Eames, Aimee Knight, Charles Max Wood, and playing the part of both host and guest, Cory House. Encourage your team to investigate reusable components, whether that’d be React, Angular, Vue, or Ember. Tune in![00:01:35] – OverviewWe can finally write reusable components that it is really lightweight. It doesn’t take much framework-specific code to get things done.Around 3 years ago, the idea of web component standard was all front-end developers could share our components with each other whether someone is in Angular or React. Web components continue to be an interesting standard but people continue to reach for JavaScript libraries instead – React, Angular, Vue. [00:04:50] – Browser support issueThe story in JavaScript libraries is easier. You have more power, more flexibility, more choices, and get superior performance, in certain cases, by choosing a JavaScript library over the standard right now. If you try to use the web components standard, you have to Polyfill-in some features so you can run things across browser. You also won’t get JavaScript features like intelligently splitting bundles and lazy load differBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

11 Heinä 201758min

JSJ 268 Building Microsoft Office Extensions with Javascript with Tristan Davis and Sean LabereeThis episode is live at the Microsoft Build 2017 with Charles Max Wood and AJ O’Neal. We have Tristan Davis and Sean Laberee from the Office Team at Microsoft. Tune in and learn more about what’s new with Microsoft Office Extensions![00:01:25] – Introduction to Tristan Davis and Sean LabereeTristan Davis and Sean Laberee are Program Managers on the Microsoft Office team, focused on Extensibility.Questions for Tristan and Sean[00:01:45] – Extending Office functionality with Javascript Office isn’t just an application on Windows that runs on your PC. It is running on iPhone, iPad, Android tablet, and apps on the browser with Office Online. The team needs a new platform, add-ins, which allow you to build apps that run across all places. It’s HTML and Javascript. HTML for all the UI and a series of Javascript module calls for the document properties. Sometimes we call it OfficeJS.[00:03:20] – This works on any version of Office?It works on Office on Windows, Mac, Online and iPad.[00:03:55] – HTML and CSS suck on mobile?There are things that you’re going to want to do when you know you’re running on a mobile device. If you look at an add-in running on Outlook for iPhone, the developer does a lot of things to make that feel like part of the iPhone UI. Tristan believes that you could build a great add-in for Office using HTML and JavaScript.[00:05:20] – Are these apps written with JavaScript or you have a Native with WebView?Office itself is Native. All of it is Native code but the platform is very much web. The main piece of it is pointing at the URL. Just go load that URL. And then, you can also call functions in your JavaScript.[00:06:35] – Why would you do this? How does it work?The add-in platform is a way to help developers turn Word, Excel and PowerPoint into the apps that actually solve user’s business problems. The team will give you the tools with HTML and JavaScript to go and pop into the Word UI and the API’s that let you go manipulate the paragraph and texts inside of Word. Or in Excel, you might want to create custom formulas or visualizations. The team also let people use D3 to generate their own Excel charts.And developers want to extend Office because it’s where a lot of business workers spend their days 0 in Outlook, Teams, Word, Excel.[00:10:00] – How did this get delivered to them?There are 2 ways to get this delivered. One, there’s an Office Store. Second, if you go into Word, Excel, and PowerPoint, there’s a store button and you can see tons of integrations with partners.For enterprises, IT can deploy add-ins to the users’ desktops without having stress about deploying MSI’s and other software deployments that the web completely rids off. The add-ins make a whole lot of pain the past completely go away.[00:11:00] – Everybody in the company can use a particular plug-in by distributing it with Office?That’s right. You can go to Office 365 add-in experience. Here’s the add-in and you can to specific people or everyone who’s part of a group.For the developer’s perspective, if you have the add-in deployed to your client, you could actually push updates to the web service and your users get the updates instantly. It’s a lot faster turn-around model.[00:14:20] – What about conversations or bot integrations?There’s the idea of connectors at Teams. You can subscribe to this web book and it’ll publish JSON. When the JSON is received, a new conversation inside of Teams or Outlook will be created. For example, every time someone posts on Stack Overflow with one of the tags that team cares about, it posts on Outlook.It’s a great way to bring all the stuff. Rather than have 20 different apps that are shooting 20 different sets of notifications, it’s just all conversations in email, making do all the standard email things.And in the connector case, it’s a push model. The user could choose what notifications they want.You’d also learn things like bots. You can have bots in Teams and Skype. The users can interact with them with their natural language.[00:18:40] – How about authentication?As long as you’re signed into Office, you can call JavaScript API to give you an identity token for the sign in user and it will hand you a JWT back. That’s coming from Azure Active Directory or from whatever customer directory service. That’s standard.If you want to do more, you can take that identity token and you can exchange that for a token that can call Microsoft graph. This app wants to get access to phone, are you okay with that? Assuming the user says yes, the user gets a token that can go and grab whatever data he wants from the back-end.[00:20:00] – Where does it store the token?That’s up to the developer to decide how they want to handle that but there are facilities that make sure you can pop up a dialog box and you can go to the LO-flow. You could theoretically cache it in the browser or a cookie. Or whatever people think is more appropriate for the scenario.[00:20:55] – What does the API actually look like from JavaScript?If you’re familiar with Excel UI, you can look at Excel API. It’s workbook.worksheets.getItem() and you can pass the name of the worksheet. It can also pass the index of the worksheet.[00:22:30] – What’s the process of getting setup?There’s a variety of options. You can download Office, write XML manifest, and take a sample, and then, side loads it into Office. You can also do that through web apps. There’s no install required because you can go work against Office Online. In the Insert menu, there’s a way to configure your add-ins. There’s upload a manifest there and you can just upload the XML. That’s going to work against whatever web server you have set up.So it’s either on your local machine or up in the cloud. It’s as much as like regular web development. Just bring your own tools.[00:24:15] – How do you protect me as a plug-in developer?There’s an access add-in that will ask your permission to access, say, a document. Assume, they say yes, pipes are opened and they can just go talk to those things. But the team also tries to sandbox it by iframes. It’s not one page that has everybody’s plug-ins intermingle that people can pole at other people’s stuff.[00:27:20] – How do you support backward compatibility?There are cases where we change the behavior of the API. Every API is gated by requirement set. So if a developer needs access to a requirement set, he gets an aggregate instead of API’s that he can work with but it isn’t fixed forever.But it’s not at that point yet where we end up to remove things completely. In Office JS, we’ve talked about API’s as one JavaScript library but really, it’s a bootstrap that brings in a bunch of other pieces that you need.[00:30:00] – How does that work on mobile? Do they have to approve download for all components?You can download components by using the browser that the operating system gives. It’s another one of the virtues of being based on the web. Every platform that has a web browser can have JavaScript execution run-time. It allows for the way that their app guidelines are written.[00:33:15] – How about testing?It’s a place where there’s still have work to do. There’s a bunch of open-source projects that partners have started to do that. What they’ve done is they’ve built a testing library. Whatever the mock is, it's just a thing on Github. It is open-source friendly. So the team could be able to contribute to it. “Here’s an interesting test case for this API. I want to make sure that it behaves like this.[00:35:50] – Could you write it with any version for JavaScript e.g. TypeScript?A Huge chunk of the team is big TypeScript fans. They’ve done a lot of work to make sure that TypeScript experience is excellence.Type is basically a collection of typing files for TypeScript. There’s a runtime process that parses your TypeScript, gives you feedback on your code, and checks for errors. You can also run it in the background.There’s an add-in called Script Lab. Script Lab is literally, you hit the code button and you get a web IDE right there. You can go start typing JavaScript code, play with API’s, and uses TypeScript by default. It’ll just actually load your code in the browser, executes, and you can start watching.[00:39:25] – Are there any limitations on which JavaScript libraries you can pull in?There a no limitations in place right now. There are partners that use Angular. There are partners that are big React fans. If you’re a web dev, you can bring whatever preferences around frameworks, around tools, around TypeScript versus JavaScript.[00:45:20] – What’s the craziest thing you’ve seen done with this API?Battleship was pretty cool. There’s also Star Wars entering credits theme for PowerPoint.[00:46:40] – If a developer is building a plug-in and get paid for it, does Microsoft take credit for that?There are 2 ways that folks can do it. You can do paid add-ins to the store. Either you do the standard perpetual 99 cents or you can do subscriptions, where it’s $2.99/month. Tristan encourages that model because integrations are just a piece of some larger piece of software.But Microsoft is not in the business of trying to get you to pay me a little bit of 10 cents a dollar. It’s really in the business of making sure that you can integrate with Office as quickly as possibly can.When the users go to the store, they can use the same Microsoft account that you use to buy Xbox games or movies in the Xbox, Windows apps in the Windows store.[00:52:00] – The App ModelIf folks are interested in the app model, they should go to dev.office.com to learn more about it because that’s where all the documentation is. Check out our Github. Right there in the open, there’s the spec. Literally, the engineers whoBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

4 Heinä 20171h 7min

JSJ 267 Node 8 with Mikeal Rogers, Arunesh Chandra, and Anna HenningsenOn today’s episode of JavaScript Jabber we have panelists Joe Eames, AJ O’Neil, Amiee Knight and Charles Max Wood and we are talking about Node 8. To help us we have special guests Mikeal Rodgers, Arunesh Chandra, and Anna Henningsen. It’s going to be a great show. Tune in.[1:56] Is Node 8 just an update or is there more?- More than just an update- Two main points:- Improved https://www.npmjs.com/package/prana support- Native API- Native APIs are helpful for Native Add-ons. For both the consumer and the developer side.- Prior to update these Node Native modules ran in C++ and bound to specific to Node 8 APIs.- Causes these modules to be updated or reconciled every time these modules are rereleased.- Creates burden for module maintainers.- Creates friction in upgrading Node versions in production departments.- If you have a deployment depending on a certain Native module, some of the modules may not get updated in time when updating your Node versions. Keeping people from updating Node.- Creates compatibility issues with Node users not using Node 8- Experimental support for a Native layer in Node 8 to eliminate these issues as much as possible.- Important milestone for the module ecosystem.- You can write extensions for Node in C++ and it decouples V8 so you can use something else on the front.- Modules takes dependency on V8 API specific to a particular version. So if V8 changes your module will be extracted from that.- As a side benefit, you can have another VM to take advantage of that.- Major version upgrades mean updating Native modules and usually some of those modules haven’t updated to the newest version of Node and be complicated.- Deep dependency wise, about 30% depends on a Native module somewhere- In the future, with the Native API, you’ll be able to update Node without breaking modules.[5:51] What kind of work went into this?- Most of the work was in C++- First thing that was done was, they looked at the top dependent Native modules in the ecosystem.- Looked for what kind of V8 exposure they had and cataloged it- Looked at how these APIs and what their purposes were- Looked for a way to extract them so that they are part of Node Core- Created neutral APIs, now part of the Node core.- All C APIs- Also has a C++ wrapper to improves usability of the API.[7:17] What’s an example of what you can do with these APIs?- Native modules allows for tighter integration and better module performance- Specific APIs that you can use in V8 that isn’t available through JavaScript- If you have a C++ variable code and you want to expose a variable into JavaScript, that is V8 API note a Node 8 API- Having it bound directly to the VM was something they wanted for a long time- Google controls V8 and they bind to V8- Created a better relationship with Google starting in IOJS- Also worked with Microsoft with their Node Shocker work.- Same with https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey- https://github.com/mozilla/spidernode is in the works[9:23] Have you guys done any testing for performance?- Some. There is a performance working group.- There is a need to stay on top of V8- V8 team has focused on new language features- Many features have been added over the years- Many didn’t come in optimized- The performance profile has changed with these features- If you’re using new language features, you will see a performance boost- In core, still tracking down code that was specific to the old optimizer and rewriting i to work the new optimizer- https://turboc.codeplex.com/ compiler hasn’t landed yet, but is to come.- Will have a completely different performance profile- In most real world applications it will be faster- Waiting on the release to take a version of V8 to make it easier to upgrade features in the future[11:28] Are the new features picked up from V8 or implemented in Node?- It’s all in V8- Better longterm support- Promises are made better in Node as a platform- Added new method called util.promisify()- Implementation comes from V8- Allows for more optimization for promises in Node core- Promise support for the one-deprecated domains module.[13:02] Is there anything more than NMP 5?- First off, delete your NMP cache.- It’s in your home directory usually with a .npm extension[14:09] What are the new features in V8?- Unlimited heap sizes, previously had a 4gb limit. No fixed limit.[14:09] Will you see things like chakra come out tuned for servers?- Profiles of a server for application process are getting smaller- Getting cut into containers and VMs and micro services- Vms that have cold boot time and run quickly in a strained environment is looking more like what we will see in the future- Yes, especially if you’re using cloud functions- V8 is optimized for phones, but Chakra is even more so- Looking for opportunities for VMs can be solely optimized for a device target- Node take advantage of that VM- VM neutrality is an interesting concept- VM Vendors trying to optimize it based on workloads of a server- Opens opportunities for Node- Node Chakra has been proved to iOS. You can cut off jitting off which was a requirement to be able to be in the Apple App Store- Node is not just for servers anymore- Node doesn’t take a long time configuring it- When a developer runs code on an IoT or a mobile app they don’t control the VM that is bundled, they run it on top of Node and it just works.- VM neutrality gives a new vector, so you can swam a whole different VM[18:44] When running different engines like iOS vs Android, does the profile change?- What it comes down to is if it’s eventive programming- The browser is an eventive environment, is very efficient waiting for things to happen before it does something- The way that we program servers and nodes are the same as well- the basics are the same generally- environmental differences exist but the programming model is usually the same- What does impact it is memory and processor and hardware and things like that- That is where tuning the VM comes into play[20:29] What is the new Async Hooks API used for?- Node has been lacking for automated inspection of Async Hook- No way for Node to tell you when scheduling and beginning of an Async operation. Hook helps with that- it’s a way for developers to write debugging features- Node tells the application that it’s working with Asynchronous way.- The embedded inspector has been embedded since Node 6- Now has a JavaScript API to use it- You can use things like Chrome debugger inside the running node process- Old debugging protocol has been removed- VM.run is still there but in the process of being deprecated[22:34] How like is the experimental Node API will change?- Marked as experimental because it’s the first time in the open- Hopefully out of experimental soon- Soon can port API to the existing LTS- Looking for more people to participate with the new API and give feedback- Fix any concerns before it goes to LTS- Some other experimental things are in the works like ASync Hooks and how it interacts with promises- Renaming some features- Another new feature - serializer and deserializer that comes with V8- experimental but will most likely stay[25:31] what is your standard for going to LTS?- Major releases every 6 months- Next Oct Node 9 will come out and then Node 8 will be LTS- Documentation, updates, additions etc will be ready then- Plan to do it for 2.5 years- Every even releases come out to LTS as the odd release comes out- Helps keeps a current line while having something new in the release line- Node 6 is the current LTS version[27:26] What are you taking out or deprecating in Node 8?- Use the word deprecate sparingly- If many people use features, it’s hard to get rid of- Security issue with Buffer, constructor argument was ambiguous- Had added APIs that were more explicit over time and pushed those- Now it will be deprecated[28:43] 21% - 33% Performance increase with some Node updates- Someone online updated their React app to Node 8 and found an 21% - 33% increase- Benchmarking group tests to make sure things are getting faster- V8 is always getting faster as well- Code changes fast and so there is a chance performance slows down so they have people to check- Benchmark test are all automated by a team[30:47] Is it safe to just switch to Node 8?- For front-end, yes- clear your NPM cache- Back use cases will usually wait until LTS[31:28] Where any of the features hard to implement?- The API work took about a year- It was a collaboration which made it interesting- IBM, Intel, Google were involved- The collaboration took a while- Also Async hooks took at least a year.- Async hooks used to be callBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

27 Kesä 201753min

On today’s episode of JavaScript Jabber, Charles Max Wood and panelist Joe Eames chat with Rebecca Turner, tech lead for https://www.npmjs.com/, a popular Javascript package manager with the worlds largest software registry. Learn about the newly released NPM 5 including a few of the updated features. Stay tuned![1:58] Was the release of node JS 8 tied to NPM5?- Features in NPM5 have been in planning for 2 years now.- Planned on getting it out earlier this year.- Node 8 was coming out and got pushed out a month.- Putting NPM5 into Node 8 became doable.- Pushed really hard to get NPM5 into https://nodejs.org/en/blog/release/v8.0.0/ so that users would get NPM5 and updates to NPM5.[2:58] Why would it matter? NPM doesn’t care right?- Right you can use NPM5 with any version of node.- Most people don’t update NPM, but upgrade Node.- So releasing them together allowed for when people updated Node they would get NPM 5.[3:29] How does the upgrade process work if you’re using NVM or some node version manager?- Depends. Different approaches for each- NVM gets a fresh copy of Node with new globals. NVM5 and Node 8 are bundled.- For some, If you manually upgrade NVM you’ll always have to manually. It will keep the one you manually upgraded to.[4:16] Why NPM 5?- It’s night and day faster.- 3 to 5 times speed up is not uncommon.- Most package managers are slow.- NPM 5 is still growing. Will get even faster.[5:18] How did you make it faster?- The NPM’s cache is old. It’s very slow. Appalling slow.- Rewrote cache- Saw huge performance gains[5:49] What is the function of the cache?- Cache makes it so you don’t have to reinstall modules from the internet.- It has registry information too.- It will now obey http headers for timing out cache.[6:50] Other things that made it faster?- Had a log file for a long time. It was called https://docs.npmjs.com/cli/shrinkwrap.- NPM 5 makes it default.- Renamed it to packagelog.json- Exactly like shrinkwrap package file seen before- In combo with cache, it makes it really fast.- Stores information about what the tree should look like and it’s general structure.- It doesn’t have to go back and learn versions of packages.[7:50] Can you turn the default Packagelog.json off?- Yes. Just:- Set packagelog=false in the npmrc[8:01] Why make it default? Why wasn’t it default before?- It Didn’t have it before. Shrinkwrap was added as a separate project enfolded in NPM and wasn’t core to the design of NPM.- Most people would now benefit from it. Not many scenarios where you wouldn’t want one.- Teams not using the same tools causes headaches and issues.[9:38] Where does not having a lock show up as a problem?- It records the versions of the packages installed and where NPM put them so that when you clone a project down you will have exactly the same versions across machines.- Collaborators have the exact same version.- Protects from issues after people introduce changes and patch releases.- NPM being faster is just a bonus.- Store the sha512 of the package that was installed in the glock file so that we can verify it when you install. It’s Bit for bit what you had previously.[11:12] Could you solve that by setting the package version as the same version as the .Json file?- No. That will lock down the versions of the modules that you install personally, not the dependancies, or transitive dependancies.- Package log allows you to look into the head of the installer. This is what the install looks like.[12:16] Defaulting the log file speed things up? How?- It doesn’t have to figure out dependences or the tree which makes it faster.- Shrinkwrap command is still there, it renames it to shrinkwrap but shrinkwrap cannot be published.- For application level things or big libraries, using shrinkwrap to lock down versions is popular.[13:42] You’ve Adopted specifications in a ROC process. When did you guys do that?- Did it in January- Have been using them internally for years. Inviting people into the process.- Specifications- Written in the form of “Here is the problem and here are the solutions.”- Spec folder in NPM docs, things being added to that as they specify how things work.- Spec tests have been great.[14:59] The update adds new tools. Will there be new things in registry as well?- Yes.- Information about a package from registry, it returns document that has info about every version and package json data and full readme for every version.- It gets very large.- New API to request smaller version of that document.- Reduces bandwidth, lower download size, makes it substantially faster.- Used to be hashed with sha1, With this update it will be hashed with sha512 as well as sha1 for older clients.[16:20] Will you be stopping support for older versions?- LTS version of NPM was a thing for a while. They stopped doing that.- Two models, people either use whatever version came with Node or they update to the latest.- The NPM team is really small. Hard to maintain old NPM branches.- Supports current versions and that’s pretty much it.- If there are big problems they will fix old versions. Patches , etc.[17:36] Will there ever be problems with that?- Older versions should continue to work. Shouldn’t break any of that.- Can’t upgrade from 0.8.- It does break with different Node version- Does not support Node versions 0.10 or 0.12.[18:47] How do you upgrade to NPM?- sudo npm install -gmpm- Yes, you may not need sudo. depend on what you’re on.[19:07] How long has it been since version 4?- Last October is when it came out.[19:24] Do you already have plans for version 6?- Yes!- More releases than before coming up.- Finally deprecating old features that are only used in a few packages out of the whole registry.- Running tests on getting rid of things.[20:50] Self healing cache. What is it and why do we want it?- Users are sometimes showing up where installs are broken and tarbols are corrupted.- This happens sometimes with complicated containerization setups makes it more likely. It’s unclear where the problem actually is.- https://www.npmjs.com/package/cacache - content addressable cache. Take the hash of your package and use it to look up address to look it up in the cache.- Compares the Tarbol using an address to look it up in the cache.- Compares to see if it’s old. Trashes old and downloads updated one.- Came out with the cache. Free side effect of the new cache.[23:14] New information output as part of the update?- NPM has always gave back you the tree from what you just installed.- Now, trees can be larger and displaying that much information is not useful.- User patch - gives you specifically what you asked for.- Information it shows will be something like: “I installed 50 items, updated 7, deleted 2.”[24:23] Did you personally put that together?- Yes, threw it together and then got feedback from users and went with it.- Often unplanned features will get made and will be thrown out to get feedback.- Another new things ls output now shows you modules that were deduped. Shows logical tree and it’s relationships and what was deduped.[25:27] You came up to node 4 syntax. Why not go to node 8?- To allow people with just node 4 be able to use NPM.- Many projects still run Node 4. Once a project has been deployed, people generally don’t touch it.[26:20] Other new features? What about the File Specifier?- File specifier is new. File paths can be in package json, usually put inside pointing to something inside your package.- It will copy from there to your node modules.- Just a node module symlink.- Much faster. Verifiable that what’s in your node modules matches the source. If it’s pointing at the right place it’s correct. If not, then it’s not.- Earlier, sometimes it was hard to tell.[27:38] Anything else as part of the NPM 5 release? Who do you think will be most affected by it?- For the most part, people notice three things:- 1st. no giant tree at the end- 2nd. Much faster- 3rd. Package lock.[28:14] If it’s locked, how do you update it?- Run npm installer and then npm update- Used to be scary, but works well now.- Updates to latest semver, matches semver to package json to all node modules.- Updates package lock at the same time- Summary in Git shows what’s changed.[28:59] Did Yarn come into play with your decisions with this release?- The plans have been in play for a long time for this update.- https://yarnpkg.com/en/ inclusion of similar features and the feedback was an indicator that some of the features were valuable.[29:53] Other plans to incorporate features similar to yarn?- Features are already pretty close.- There are other alternative package managers out there.- PMPM interesting because when it installs it doesn’t copy all the files. It cBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

20 Kesä 201741min

JSJ 265 Wade Anderson and Ramya Rao on Visual Studio CodeThis episode is live at the Microsoft Build 2017 with Charles Max Wood and AJ O’Neal. We have Wade Anderson and Ramya Rao from the Visual Studio Code Team at Microsoft. Tune in and learn more about what’s new with Visual Studio Code![00:01:20] – Introduction to Ramya Rao and Wade AndersonRamya Rao and Wade Anderson are in the Visual Studio Code Team at Microsoft.Questions for Wade and Ramya[00:02:00] – Elevator Pitch for Visual Studio CodeOur vision on Visual Studio Code is to take what was best out of the IDE world (Visual Studio, Eclipse, IntelliJ, etc.) and bring what was best from the lightweight editor world (Sublime Text, Notepad++, Atom) and merge those two together. We wanted the lightweight features from text editors and the debugging capabilities of Visual Studio and Eclipse. We did general availability last year. We’ve been stable for a year. Additionally, this is Visual Studio Code for Mac, Windows, or Linux. It’s also built in Electron.[00:03:45] – What are your roles on the team? Do you have particular parts that each of you work on?Wade’s title is a Program Manager. He does more non-developer things but Ramya is an engineer on the team so she gets a lot more coding that Wade does. Everybody has a key area to own but nothing stops them to go into another area. We try to share knowledge between people but we always have that one key owner that you always go to.Ramya is a recent addition to the team. She started out maintaining the Go extension, maintaining and adding features. She’s slowly branching out to the Emmet features of the product.[00:05:30] What is Emmet?Emmet, or Zen Coding, is a must-have tool for you. You can write, say abbreviations and that expands to really huge HTML to update tags, rename tags, etc. That is one of the features of Emmet and Sergey actually wrote the library. We have an in built integration in the product. I [Ramya] am currently working on that.[00:06:28] Does Visual Studio Code make it easy to go to the parts that I need to customize on an HTML?In that case, we have a multi-cursor software in Visual Studio Code, as well. You could place your cursor in different positions, and then, simultaneously edit things.[00:07:42] Is Emmet an extension or does it come with Visual Studio Code?Right now, it’s in Built. If you want to know more about Emmet features, you can to emmet.io. That has all the documentation that you need to learn about Emmet features. In Visual Studio Code right now, we’re looking at making into an extension. We pull it out of the main code and maybe more people can contribute and make it even more better.[00:08:21] – What’s new in Visual Studio Code?One of our main pillars for this year is to improve performance of the product. We’ve grown a larger team so we’re adding a lot more features every month. Last few months has been, “How can we get some stability on the issues coming in while making sure we’re reducing our tech load?” We really keep to those core principles that we started with at the beginning, which was, we want a fast, lightweight editor.We built a few extensions that we call key map extensions. They are just a mapping of key bindings that you learned in Sublime Text. You don’t have to re-learn any key bindings in Visual Studio Code.We also build this Welcome page where you can flip through and see features really briefly. In that Welcome page, one of the key things is an interactive playground where you can play with existing code in different sections. Additionally, as we’ve mentioned, we also put multi-cursor features.Another thing is workbench naming. You can change the theme of Visual Studio Code but it will be restricted to the editor and not the rest of the workbench.[00:13:40] – Do you know how Xterm.js works as it was one of the features that you’ve added in Visual Studio Code?Daniel’s another engineer that’s here with us today. He was the largest contributor to the Xterm.js project. He built the integrated terminal for Visual Studio code so I can’t speak to the internals of how that works.[00:14:12] – Are we going to start seeing Visual Studio Code integrated into web experiences with other Microsoft products?That’s actually where we started. We were Monaco editor where you get this cloud-based editing experience. We’re getting people to use it but we’re only getting people who were already using Microsoft products.  When electron came out, we saw an opportunity of, “Hey, can we port this  Monaco editor to Electron and we could then, run it on Mac and Linux.”[00:19:45] – What are the performance things that you’ve done?One thing that we did recently was adding an ability to calculate the start time for Visual Studio Code? That’s one of our full steps to get more information from the user-side. How can you get a profile of what things are running? Which part of the process took much time?We also need to identify what are the things people are doing that’s causing the editor slow down. An example is when you open a large file and things get laggy.Another exercise we did was we looked at all of our extension API’s to see which one of those could be a malicious extension.The difference between VS Code and Atom is that, we ask questions like, “Are we using good data structures? Are we managing our memory properly? Are we removing stuff we don’t need anymore?” That just comes down to all those little things you learn from basic textbooks that have been around for decades about how to write good code. That’s what we have been doing and that’s what we’ll continue to try to do, to try and improve the performance.[00:25:55] – Do you have problem on the desktop? Are all the modules just load at once?We definitely don’t load everything at once. Different parts of the editor is loaded differently. When you do the Require, we don’t do it at first load. We do it when we notice that the user wants to use Emmet. We don’t try to load all the library at the beginning and delay the whole process.We try to lazy load as much as possible, even the extensions. We have a separate process called extension host that takes care of loading all the extensions. Whether the extensions are completed loading or not, that does not stop you from typing in a file. Simple actions shouldn’t be bugged down by fancy actions.[00:28:25] – What’s coming next for Visual Studio Code?Every month, when we plan our iteration, we create iteration draft plan. We put it out there for people to see. Performance and helping people get started are probably the top two for us. You can look at github.com/Microsoft/vscode, look for the label ‘iteration plan draft.’ So that’s the current work that we’re doing that month.Another feature is the multi-root workspace where you can open multiple folders. When you look at the issues and sort by most comments, multi-root is the number one. The second one that is little paper cuts around formatting and auto-intending – just things that make your code prettier.PicksAJ O’nealBreath on the WildMicrosoft’s Intelligent EdgeCharles Max WoodBoom BeachBluetick.ioEmacs key binding extension for Visual Studio CodeWade AndersonKindle Paperwhite Twitter @waderyan_Ramya RaoOpen sourceTwitter @ramyanexusSpecial Guests: Ramya Rao and Wade Anderson. Support this podcast at — https://redcircle.com/javascript-jabber/donationsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/javascript-jabber--6102064/support.

13 Kesä 201747min