|
ModeSix posted:In case anyone else is interest, I found a Typescript course on edx.com that is sponsored by Microsoft. Related to this, the TypeScript course on PluralSight is pretty decent. Their course on Gulp is great too, while we're at it.
|
# ? Apr 7, 2016 07:38 |
|
|
# ? Jun 8, 2024 18:48 |
|
This feels like a dumb problem to post in this thread of smart people, but here I am. Working on a site for a client. They basically want to emulate Adele's site header, with the change on scroll and the fancy full screen overlay nav. I got Headroom working which is neat. But the full screen nav (a thing I don't even really like) is proving harder. There are a lot of these out there - anybody have one they like? I've been having mixed results.
|
# ? Apr 11, 2016 22:06 |
|
DirtyCheeseburgers posted:This feels like a dumb problem to post in this thread of smart people, but here I am. http://www.w3schools.com/howto/howto_js_fullscreen_overlay.asp
|
# ? Apr 11, 2016 22:20 |
|
DirtyCheeseburgers posted:This feels like a dumb problem to post in this thread of smart people, but here I am. The moment I saw that I remember seeing it on codrops http://tympanus.net/Development/FullscreenOverlayStyles/index3.html
|
# ? Apr 20, 2016 00:15 |
|
Never mind. I was for some reason trying to see a the source map of the bundled file rather than the original TS file.
Ochowie fucked around with this message at 22:53 on Apr 29, 2016 |
# ? Apr 29, 2016 22:45 |
|
Anyone using Vue JS? It's super simple to pick up and start hacking with right away and the guides are great: http://vuejs.org/ 2.0 is coming out sometime this year (beta slated for sometime this month). I've been hacking away on an SPA using 1.x, if you have any questions feel free to ask. I started to learn React recently and a part of me enjoys JSX (i know, weird), but I'm much more productive in Vue. One of my favorite features is vue-loader / vueify which gives you single-file components (if you want them), with hot reloading and all that jazz. cZk fucked around with this message at 15:14 on May 3, 2016 |
# ? May 3, 2016 15:11 |
|
Angular 2 RC1 is out. https://github.com/angular/angular/blob/master/CHANGELOG.md Guess I should complete the intro to Angular 2 lesson I started a while back.
|
# ? May 3, 2016 15:28 |
|
cZk posted:Anyone using Vue JS? It's super simple to pick up and start hacking with right away and the guides are great: http://vuejs.org/ 2.0 is coming out sometime this year (beta slated for sometime this month). Yeah, vue.js is pretty neat. There's actually several things I'd rather be using than React and Redux. (Elm probably being numero uno) The problem is that React is really good and the ecosystem and community around React is just so big making it hard to really hard for me to justify using something else.
|
# ? May 3, 2016 15:45 |
|
Thermopyle posted:Yeah, vue.js is pretty neat. There's actually several things I'd rather be using than React and Redux. (Elm probably being numero uno) Yeah that's definitely a big reason to go with React. The community is huge, support is easier to find, and there are a lot of good examples and libraries for React out there. It's pretty mature and a lot of big companies are using it successfully in production. Twitter just released their new mobile website using React, React-Router and Redux. On the subject of react -- I recently had the time to go though a MobX tutorial and really enjoyed what I saw. cZk fucked around with this message at 16:08 on May 3, 2016 |
# ? May 3, 2016 16:06 |
|
IronDoge posted:Angular 2 RC1 is out.
|
# ? May 4, 2016 00:39 |
|
Ghost of Reagan Past posted:If I start using it for a project now, is it likely to break because of changes through release or is all that fixed?
|
# ? May 4, 2016 00:40 |
|
Vulture Culture posted:Etiquette suggests that if you're going to call something a release candidate, the API is stable
|
# ? May 4, 2016 00:41 |
|
Ghost of Reagan Past posted:If I start using it for a project now, is it likely to break because of changes through release or is all that fixed? The API interfaces have been pretty stable since it entered the beta phase, they've mainly just been doing bugfixes.
|
# ? May 4, 2016 01:13 |
|
Anyone have any good tutorials for Angular 2? I'm somewhat familiar with Angular 1...
|
# ? May 4, 2016 01:35 |
|
Ghost of Reagan Past posted:Anyone have any good tutorials for Angular 2? I'm somewhat familiar with Angular 1... A good warmup to that (if you have not already) would be to use TypeScript with Angular 1, and try to write your application using the .component (instead of .controller and .directive) introduced in Angular 1.5. This will get you more in line with some of the major design decisions for Angular 2. After that, I'd take a look at these https://github.com/DanWahlin/Angular2-JumpStart https://github.com/johnpapa/angular-styleguide
|
# ? May 4, 2016 01:40 |
|
Am I alone in thinking it's kind of an odd decision for Google to double down on Typescript for Angular 2? I routinely see ES6 out in the wild and we are even using it here for some things at CNN. But Typescript would be like spotting a Unicorn. I assume the Angular team has their reasons, but it still seems odd.
|
# ? May 4, 2016 12:20 |
|
it's a really good technology, and someone has to be first
|
# ? May 4, 2016 14:20 |
|
HaB posted:Am I alone in thinking it's kind of an odd decision for Google to double down on Typescript for Angular 2? quote:it's a really good technology, and someone has to be first
|
# ? May 4, 2016 14:27 |
|
HaB posted:Am I alone in thinking it's kind of an odd decision for Google to double down on Typescript for Angular 2? Well it was a slow gestation for them: they started using AtScript, their own version of JS that used Decorators. Then they got TypeScript to add Decorators so went with them. They tooth and nail wrote everything in TS a couple years ago before ES6 standards were really in common usage. They're just sort of lashed to it now. Not that I particularly mind as I love TypeScript. But anyway, ya'll shouldn't be using Angular 2 cos it's non-standard garbage http://aurelia.io/ Aurelia - it's like Angular 2 but standards compliant, smaller and faster. It's much nicer to code and has proper separation of church-and-state so your HTML and JS don't need to mix and get confusing as gently caress. We've adopted it for our next enterprise product and it's amazeballs. You don't have to teach anyone "aurelia" cos everything is pure standards-compliant HTML and JavaScript with only the barest of conventions. It's really, really nice and has skeletons in ES6 and TypeScript.
|
# ? May 4, 2016 14:34 |
|
Oh dang I didn't know TS got decorators. Tell me it can make generators work interchangeably with arrays and other iterables like in Python without importing a monkey patch library and I might never bother with vanilla JS again.
|
# ? May 4, 2016 14:58 |
Munkeymon posted:Oh dang I didn't know TS got decorators. Tell me it can make generators work interchangeably with arrays and other iterables like in Python without importing a monkey patch library and I might never bother with vanilla JS again. Yup. https://github.com/Microsoft/TypeScript-Handbook/blob/master/pages/Iterators%20and%20Generators.md
|
|
# ? May 5, 2016 01:00 |
|
gmq posted:Yup. To clarify, I mean I want to be able to do thing.map() without having to check whether it's an array or a generator, which is not currently possible without monkey-patching the generator prototype in ES6 and doesn't seem to be part of ESnext, either. Strikes me as a silly oversight, too.
|
# ? May 5, 2016 14:51 |
|
Plavski posted:But anyway, ya'll shouldn't be using Angular 2 cos it's non-standard garbage explain to me how Aurelia is "more standards complaint" than Angular 2. Last I checked, Angular 2 doesn't require a bunch of non-standard APIs to be implemented in the browser running it or something. just because something has a build step doesn't make it "less standards compliant"
|
# ? May 6, 2016 01:45 |
|
abraham linksys posted:explain to me how Aurelia is "more standards complaint" than Angular 2. Last I checked, Angular 2 doesn't require a bunch of non-standard APIs to be implemented in the browser running it or something. just because something has a build step doesn't make it "less standards compliant" More to the point, you CAN develop in pure ES6 if you really want to when using Angular 2.
|
# ? May 6, 2016 01:47 |
|
abraham linksys posted:explain to me how Aurelia is "more standards complaint" than Angular 2. Last I checked, Angular 2 doesn't require a bunch of non-standard APIs to be implemented in the browser running it or something. just because something has a build step doesn't make it "less standards compliant" Angular 2 uses non-standard HTML like ngFor. HTML is not case sensitive so angular 2 had to write their own HTML parser to handle case sensitive attributes because they don't follow standards. Likewise their local variable definition uses #value which is not JavaScript standards and requires extra work by the library to handle. It also eschews the standards <template> convention to indicate HTML that is to be handled by a library in favour of its own method. Angular 2 requires a lot more under the hood to make it work rather than using the standards that are part of the ES2015 definitions. Aurelia is made by a former angular 2 developer who quit Google because they were deviating so much from standards that it was turning into a difficult mess like angular 1 again. For some more detail on Angular2's issues with compliance, see here: http://eisenbergeffect.bluespire.com/on-angular-2-and-html/ Plavski fucked around with this message at 09:41 on May 6, 2016 |
# ? May 6, 2016 07:21 |
|
Plavski posted:Angular 2 uses non-standard HTML like ngFor. HTML is not case sensitive so angular 2 had to write their own HTML parser to handle case sensitive attributes because they don't follow standards. I have a hard time believing it was just a "BUT STANDARDS! I will not stand by while you ruin the internet! For the greater good, I can no longer contribute to this monstrosity and therefore tender my resignation!"
|
# ? May 6, 2016 16:25 |
|
In other Modern Front End Development News™ I am almost done writing a standards compliant ES6 app with React + Redux..... and I haven't imported either of them yet. To me that's the biggest reason to use that combo. I have a fully unit-tested set of actions / action-creators / reducers that handle the UI, calls to remote services, etc. and have yet to use any "framework" code at all. The meat of the app is 100% portable in case I decide to use a different framework (or use additional frameworks like react-native.)
|
# ? May 6, 2016 17:19 |
|
Skandranon posted:I have a hard time believing it was just a "BUT STANDARDS! I will not stand by while you ruin the internet! For the greater good, I can no longer contribute to this monstrosity and therefore tender my resignation!" It wasn't entirely that, but he worked as a consultant for 10 months and was told they were making this awesome, fully standards compliant, super great simple product. By the end that was nothing like the product they started out with so quit and made a new version of his old Durandal framework that didn't mix html and javascript and did have all that weird angular 2 stuff and stuck really closely to standards. We really like it at our place and after trying to work with Angular1, Angular 2, React, Knockout and Ember, decided Aurelia was the best fit for us. It's really nice that when new people join the team they don't have to take a course on Angular or anything. They can just write ES6 JavaScript and HTML5 and that's it. The rest is just convention. YMMV, of course.
|
# ? May 6, 2016 23:15 |
|
Hey guys, I could use some advice. I need to do something bad and stupid that, ideally, you'd never do. I need to render a table full of poopy data that can be, let's say up to 2000 rows and 20 columns. If your first reaction is "that's too much data, why would you ever do that?" I totally agree. It's a business requirement. I'm currently using Knockout which has a badly broken "foreach" binding. After switching to fast-foreach I was able to eliminate 60+ seconds of rendering latency. There is still what appears to be about 5-6 seconds worth of rendering latency. My boss is a performance freak and wants that last 5 seconds gone, as much as possible. (Note: fast-foreach is doing some kind of batched/staged rendering or something, making it difficult to time accurately with simple console.time calls.) So I am looking at some options to eek out more performance. - try to somehow pull out as many data-binds as possible in the current Knockout code. I quickly tried this and was able to save an easy ~1 second, but more will be hard without wrecking the code. - raw string "templating" -> insert once into the DOM - simple templating like mustache or ICanHaz (I have not benchmarked these, so they may well be too slow) - use React - ??? - tell boss it ain't happening Any experience or advice would be most welcomed. My Rhythmic Crotch fucked around with this message at 03:07 on May 7, 2016 |
# ? May 7, 2016 03:05 |
|
My Rhythmic Crotch posted:Hey guys, I could use some advice. I haven't used it in a project yet myself, but this seems like the exact use case for something like React Virtualized.
|
# ? May 7, 2016 03:12 |
|
Thanks, I will put that on the list.
|
# ? May 7, 2016 03:23 |
|
You could also render the first x amount of rows, display them, then add the rest in batches while the user has something to look at. I say this because I don't like how endless scrolling works. I don't know if this is applicable (seeing as you already have all the data needed and endless scrolling makes new calls whenever the user scrolls) but I don't like to wait for the new content to appear every time I scroll down.
|
# ? May 7, 2016 18:36 |
|
KARMA! posted:You could also render the first x amount of rows, display them, then add the rest in batches while the user has something to look at. React Virtualized is more of a general-purpose virtual scrolling library than endless scrolling, in that it delays the rendering of data that may have already been retrieved. It also allows you to set an "overscan", or amount of rows/columns beyond the current view to pre-render, which can remove the scrolling delay. I mean, given that it works via a function that returns data for a given index, you could connect that to an Ajax call or equivalent, but I think they were looking to efficiently render a large amount of data they already had in full, which would avoid the infinite scrolling latency issue.
|
# ? May 7, 2016 20:14 |
|
My Rhythmic Crotch posted:Hey guys, I could use some advice. The basic idea behind the solution to this problem is that you can't possibly see 2000 rows of data, so don't render what you can't see. Put your grid inside of a scrollable container. The math to determine what slice of your data to render is pretty trivial based on the size of the container, the scrollTop property, and the height of each row.
|
# ? May 7, 2016 23:12 |
|
I've dropped a batch rendering thing into the page, which just simply continues to render but leaves the page usable while it's doing its thing. Hopefully that will sate the boss's need for speed, but if not, virtual scrolling, pagination, and/or other shenanigans will be tried next.
My Rhythmic Crotch fucked around with this message at 02:15 on May 9, 2016 |
# ? May 9, 2016 01:58 |
|
knockout is so slow at rendering jesus christ It looks like you're not editing the data in these rows so I'm feeling your templating idea might work? If you gotta keep it "knockout-ey" you could hide it in a custom element code:
code:
code:
|
# ? May 9, 2016 23:22 |
|
I have a very, very large project that uses LESS on the frontend. I'd like to integrate Zurb's Foundation Emails, which is written in SASS. Is there any non-idiotic way to integrate the two? Right now I'm considering some kind of awful two-phase compile process, where I have a small shim SASS file to override Foundation defaults and then the compiled CSS is imported to a LESS file, where all the project-specific classes are defined. The other option I am considering is just going with SASS for the email component, and while that is good because it offloads the problem of figuring out how to support a million email clients onto Zurb, it creates a separation from the rest of the frontend, which will invariably mean the email styles will get out of sync with the rest of the project. E: What I'd really like is to convert SASS to LESS. I see there's grunt-refactor but alas, the project uses Gulp.
|
# ? May 11, 2016 06:38 |
|
Kobayashi posted:I have a very, very large project that uses LESS on the frontend. I'd like to integrate Zurb's Foundation Emails, which is written in SASS. Is there any non-idiotic way to integrate the two? Right now I'm considering some kind of awful two-phase compile process, where I have a small shim SASS file to override Foundation defaults and then the compiled CSS is imported to a LESS file, where all the project-specific classes are defined. modernFrontEnd.txt
|
# ? May 11, 2016 12:52 |
|
Does it really matter? Just run the grunt task (outside of the project build process) and include the resulting files.
|
# ? May 11, 2016 19:26 |
|
|
# ? Jun 8, 2024 18:48 |
|
In that vein, you could use gulp-grunt to run the grunt task from gulp.
|
# ? May 11, 2016 19:54 |