|
Skandranon posted:Also, feel free to PM me any questions about Angular, half my day job these days is answering questions about it. Any tips on state management stuff for Angular2 if you're not doing routing? What's the cool kid thing these days? Coworker pointed me to an article on using Redux though I'm unsure if that's overkill for our app which is relatively simple in terms of state. Right now I have a service with an observable that broadcasts state changes as strings for the app component to plop into an ngSwitch and show the right thing. Probably as simple as it gets, unsure how much of a mess it might become trying to scale.
|
# ? Nov 16, 2016 01:44 |
|
|
# ? May 19, 2024 06:57 |
|
Dogcow posted:Any tips on state management stuff for Angular2 if you're not doing routing? What's the cool kid thing these days? Coworker pointed me to an article on using Redux though I'm unsure if that's overkill for our app which is relatively simple in terms of state. I haven't had much chance to do Angular 2 beyond plan for a future upgrade... but I've had a few thoughts on the matter. Redux is good for having a central store of state, but it does involve swallowing a lot of extra things to get it. I've been toying with the idea of creating a central state holder that does not require the action-reducer stuff of Redux, but still allows things like saving/restoring the entire state object easily. For simple cases, you can just have dedicated services for managing state (applies to Angular 1 as well), and use controller methods to dynamically fetch at digest time. For most cases this is sufficient, and reduces the need to broadcast it outwards.
|
# ? Nov 16, 2016 01:55 |
|
What are your guys' thoughts on AngularJS 1.5's require component property for allowing children components to invokes methods on the parent controller? I'm a fan of keeping components isolated from each other and using bindings in component definitions to pass data from parent to child (and occasionally from child to parent via a two-way binding) because it's way more explicit and feels like it keeps components more modular. I can see how require would be convenient for doing things like allowing a "modal" component to close itself by way of invoking a method on the controller of the main view. That said, I still think it would too-tightly couple the modal controller to some arbitrary "parent" controller and implicitly require specific method names be defined in the parent, versus reading the component's bindings to figure out how to pass in a callback, then allowing the parent controller to pass an arbitrary method into the modal.
|
# ? Nov 16, 2016 03:32 |
|
IAmKale posted:What are your guys' thoughts on AngularJS 1.5's require component property for allowing children components to invokes methods on the parent controller? I'm a fan of keeping components isolated from each other and using bindings in component definitions to pass data from parent to child (and occasionally from child to parent via a two-way binding) because it's way more explicit and feels like it keeps components more modular. I can see how require would be convenient for doing things like allowing a "modal" component to close itself by way of invoking a method on the controller of the main view. That said, I still think it would too-tightly couple the modal controller to some arbitrary "parent" controller and implicitly require specific method names be defined in the parent, versus reading the component's bindings to figure out how to pass in a callback, then allowing the parent controller to pass an arbitrary method into the modal. I don't like it, as you say, it tightly couples the components. IF you have a situation where coupling makes sense, say, a list component and then it's companion list-item component, I guess? However, I prefer to try to write components such that this would not be the case, so you COULD use the list-item elsewhere, outside a list. You can pass functions into components using the & binding, so you can specify a function that can be called by a child, without mandating the child know anything or depend on functionality of it's parent.
|
# ? Nov 16, 2016 04:12 |
|
Skandranon posted:Are you sure you included the styles for angular-ui? Creating a modal IS basically making GBS threads out the HTML attached to the body or html element, but if it isn't styled, it won't look like anything remotely resembling a modal dialog box. Yeah I might but it looks like everybody is already publicly dogpiling you so I will just . According to their site, I need to include ui-bootstrap-csp.css, which I did. I can see that getting requested from Django without a 404. It also mentioned I need the stylesheets from Bootstrap. I personally didn't do anything special to try to get them. Is there a way to overtly tell that I'm short a stylesheet? I mean, beyond things just acting up like they are?
|
# ? Nov 16, 2016 04:18 |
|
Rocko Bonaparte posted:Yeah I might but it looks like everybody is already publicly dogpiling you so I will just . Open up the Chrome dev-tools and poke around the console and network tabs, you should see which requests are being fired and how they're failing. I don't know why Django is requesting your css, unless you're seeing the logs of the site sending the requests to Django, in which case I don't know why your Django is failing to serve static files that should be there.
|
# ? Nov 16, 2016 04:45 |
|
Rocko Bonaparte posted:Yeah I might but it looks like everybody is already publicly dogpiling you so I will just . Is the JS file you are using the tpls version? There are two files available, one which has the various templates bundled in it, and one which does not.
|
# ? Nov 16, 2016 06:49 |
|
I needed to include the base Bootstrap stylesheets. I worked immediately afterwards. New thing. Is there a better way to present a list of items based on a property in each item's object in an array? I have this moon language in my template: code:
code:
Edit: Aw hell, the ng-repeat doesn't even work! Rocko Bonaparte fucked around with this message at 19:36 on Nov 17, 2016 |
# ? Nov 17, 2016 19:23 |
|
Rocko Bonaparte posted:I needed to include the base Bootstrap stylesheets. I worked immediately afterwards. I'm not a fan of Angular filters, they usually end up causing unnecessary/slow digests and often make things more complex, not less. I don't see a problem with your original ng-repeat solution, it is as simple as I think it can be.
|
# ? Nov 17, 2016 20:03 |
|
What's a solid place for practical Javascript exercises? I'm reading from a textbook which is great, but I'm not really getting any hands-on experience that I need.
|
# ? Nov 18, 2016 23:45 |
|
Grump posted:What's a solid place for practical Javascript exercises? I'm reading from a textbook which is great, but I'm not really getting any hands-on experience that I need. Codecademy is a decent place to start, especially if you are new and don't want to deal with figuring out tooling.
|
# ? Nov 18, 2016 23:52 |
|
Grump posted:What's a solid place for practical Javascript exercises? I'm reading from a textbook which is great, but I'm not really getting any hands-on experience that I need. Something like https://www.codewars.com/ might be useful for you.
|
# ? Nov 20, 2016 03:33 |
|
COOL CORN posted:Something like https://www.codewars.com/ might be useful for you. I might be a little too inexperienced for some of these assignments, but this website is super cool Skandranon posted:Codecademy is a decent place to start, especially if you are new and don't want to deal with figuring out tooling. Been using this the past couple days. Looking forward to finishing the course.
|
# ? Nov 20, 2016 04:45 |
|
PlaneGuy posted:Out of curiosity, could you elaborate? Like, I haven't changed my gulp workflow since the thing came out so unless there's like a behind the scene thing I haven't noticed...? Sorry, I took a long break from the web.... Gulp's biggest problem for me is that it's another tool that you need to learn, and it's a rather un-opinionated tool. Standardizing on one tool across multiple project hasn't been easy with Gulp, especially when you have to bring in dozens of micro-dependencies for large projects and they'd sometimes conflict or be difficult to duct tape together. We're currently struggling with the same problem that prompted the creation of Yarn - our CI builds and tests are kicked off automatically for PRs and is a major pain point for us because of how slow that is with multiple projects and 3 dozen devs submitting PRs for each feature/bug. The lack of movement on 4.0 was kind of the straw that broke the camel's back for our team, but it's a minor complaint vs what I typed above. Our answer has been to use Webpack 2 (with all its faults) for JS processing, and shell scripts for everything else. It's standardized across projects with no issues, it's easy for non-JS developers to figure out, and it's stable going forward. When you have a single project, it is probably helpful to spend weeks getting your tooling just perfect for your needs by setting up Redux time machine stuff, Webpack hot loading, etc. When you have multiple projects, managing all that duct tape can take more time than delivering features. I'm paid to ship, not to have a sweet build process with bells and whistles. And while it would be cool to use hot reloading, Redux time machine, etc. I never really found myself missing those things while developing in any other language. I'm a proponent of thinking things through before throwing code up and continually tweaking it until the results are good. Even when I am spiking, I don't feel like the lack of those things has slowed me down. Gulp isn't a bad tool, but at my current and previous employer, it didn't scale in a maintainable way for our specific needs. To each their own. edit: Catching up on the thread, re: documentation chat Thermopyle posted:That's probably the first time I've ever heard anyone call the webpack documentation "quite good". Yeah, webpack is a good example of poor documentation. I used to think documentation was a lost cause until two things. The first was starting at my current employer, where everyone is expected to keep our internal wiki up to date and track any tribal knowledge. It's an amazing source of knowledge and really reduces the dependency on SMEs. The other thing is setting up Arch Linux on my Chromebook. Arch's wiki is hands-down some of the best documentation I've ever seen. It's also been easier writing C (I've never written C) and re-compiling my suckless.org tools than getting certain things working in the JS ecosystem, which says a lot about needless complexity. luchadornado fucked around with this message at 19:41 on Nov 26, 2016 |
# ? Nov 26, 2016 17:00 |
|
I'm still a big dumb idiot using Webpack when I should be using Gulp, but.. Isn't there a way I can get Webpack to look in a single folder for all js/ts/es6 files? Right now I have: code:
I tried replacing entry with: code:
|
# ? Nov 30, 2016 15:47 |
|
The Merkinman posted:complains that it can't find package.json because it looks in /js instead of root. It's complaining about that due to your enclosing context telling it to look in resolved path 'js'. (I'm the weirdo out on a limb who's been happily using jspm for the last year instead of the struggling with webpack, gulp and grunt.)
|
# ? Nov 30, 2016 16:02 |
|
The Merkinman posted:I'm still a big dumb idiot using Webpack when I should be using Gulp, but.. You need an object with a key for each file to output multiple entry points. I did something like this in an old project (so excuse the messy code): JavaScript code:
|
# ? Nov 30, 2016 16:24 |
|
Front end survey results: https://ashleynolan.co.uk/blog/frontend-tooling-survey-2016-results Glad to see my favorites doing well. Pretty comfortably in the mainstream except for my neanderthal css approach.
|
# ? Nov 30, 2016 19:37 |
|
The Merkinman posted:I'm still a big dumb idiot using Webpack when I should be using Gulp, but.. Nah, if you look at the results of that survey - people are dumping Grunt, but also Gulp, and using Webpack and npm/bash scripts for their builds. It's actually very nice and sane. Side note: we're evaluating dumping Redux because of how cumbersome it is to use, especially with Typescript. Devs are getting free lunches to rewrite one of our existing apps with another state manager to get a feel for the state management landscape. Anyone here have any production experience with MobX?
|
# ? Dec 1, 2016 01:14 |
|
How am I supposed to manipulate the DOM from an Angular (1) component? I've seen that you can inject $element into the controller, but the controller isn't supposed to do DOM manipulation, or know anything about the DOM at all.
|
# ? Dec 1, 2016 11:49 |
|
edit: nevermind
|
# ? Dec 1, 2016 17:25 |
|
qntm posted:How am I supposed to manipulate the DOM from an Angular (1) component? I've seen that you can inject $element into the controller, but the controller isn't supposed to do DOM manipulation, or know anything about the DOM at all. There are two (good) ways... One would be to create a pure Directive with a Link function that does your DOM manipulation. This can be used alongside components. However, if it makes sense to be doing your DOM manipulation inside your component... it's not the end of the world to use $element in a component.
|
# ? Dec 1, 2016 17:34 |
|
qntm posted:How am I supposed to manipulate the DOM from an Angular (1) component? I've seen that you can inject $element into the controller, but the controller isn't supposed to do DOM manipulation, or know anything about the DOM at all. It's a hassle for a reason as you should probably have your DOM manipulation/view as a dependency on your state rather than doing direct manipulation via controllers. But depends on your case.
|
# ? Dec 1, 2016 18:41 |
|
In my case my component contains an external, non-Angular object which I need to configure and set event listeners on, a Code Mirror instance. We're trying to use components rather than directives because we're expecting to move to Angular 2 soon.
|
# ? Dec 1, 2016 18:45 |
|
qntm posted:In my case my component contains an external, non-Angular object which I need to configure and set event listeners on, a Code Mirror instance. We're trying to use components rather than directives because we're expecting to move to Angular 2 soon. In this case, I would first use $element and $onInit. Once that's working fine, I would consider doing a custom directive aimed at doing Angular bindings for CodeMirror, with the ultimate objective to be able to use in multiple components wherever you are using CodeMirror. Remember, things like ng-click are just Angular provided directives which do simple DOM binding to onclick. There's no reason you can't create similar ones.
|
# ? Dec 1, 2016 19:09 |
|
ynohtna posted:It's complaining about that due to your enclosing context telling it to look in resolved path 'js'. Depressing Box posted:You need an object with a key for each file to output multiple entry points. I did something like this in an old project (so excuse the messy code): code:
|
# ? Dec 2, 2016 16:54 |
|
The Merkinman posted:I think this is kinda working but it's returning ./js\ instead of ./js/ Hmm, that seems like it might be an issue with Windows paths vs. POSIX paths. Let's try leaning on Node's path library a little more: JavaScript code:
|
# ? Dec 4, 2016 07:36 |
|
Anyone have a recommendation for a good (front-end) lightbox/image carousel-y type library? Slick wasn't quite cutting it for us in terms of responsiveness. Just need to be able to cycle through a list of images and look good on mobile or desktop.
|
# ? Dec 5, 2016 23:08 |
|
an skeleton posted:Anyone have a recommendation for a good (front-end) lightbox/image carousel-y type library? Slick wasn't quite cutting it for us in terms of responsiveness. Just need to be able to cycle through a list of images and look good on mobile or desktop. Flickity has worked well the few times I've needed carousels.
|
# ? Dec 6, 2016 03:31 |
|
I used jcarousel ( http://sorgalla.com/jcarousel/ ) in my last project. Worked very well for what I needed. I've also used royalslider before, which is a pretty feature heavy slider so could be good for complicated stuff.
|
# ? Dec 6, 2016 08:59 |
|
code:
|
# ? Dec 6, 2016 17:07 |
|
huhu posted:
@Component is a Decorator, just does some syntactic sugar. You can write Angular2 via ES5 (http://blog.thoughtram.io/angular/2015/05/09/writing-angular-2-code-in-es5.html). How Angular2 knows is that you bootstrapped your application with a component (your root component), and that contained dependencies, which Angular2 loads, which contain more, etc. Your entire application should be a complete tree of components.
|
# ? Dec 6, 2016 17:24 |
|
huhu posted:
@Component is a class decorator which is essentially a function that gets called with AppComponent as a parameter, for Angular to do with as it pleases. Check out the decorator docs.
|
# ? Dec 6, 2016 17:25 |
|
Looking through those docs, it seems that a decorator would be applied to the class it precedes?
|
# ? Dec 6, 2016 18:10 |
|
Are decorators on-track for browser support any time soon? I have a hard time not getting confused with which features are in which ES version.
|
# ? Dec 6, 2016 18:14 |
|
huhu posted:Looking through those docs, it seems that a decorator would be applied to the class it precedes? Yes, exactly. They are similar to C# class attributes in that respect.
|
# ? Dec 6, 2016 19:18 |
|
Decorators are really cool; it's really nice to be able to add all that metadata to your classes and methods.
|
# ? Dec 6, 2016 19:59 |
|
Plavski posted:Decorators are really cool; it's really nice to be able to add all that metadata to your classes and methods. There is one problem with them, in that they won't work with fat arrow syntax ( () => {} ).
|
# ? Dec 6, 2016 21:30 |
|
idgi. are you saying you cant do this?code:
code:
|
# ? Dec 7, 2016 01:33 |
|
|
# ? May 19, 2024 06:57 |
|
Redmark posted:Are decorators on-track for browser support any time soon? I have a hard time not getting confused with which features are in which ES version. They're currently at stage 2 in this process: https://tc39.github.io/process-document/ At stage 4, a feature will be included in the yearly version of the ECMAscript standard.
|
# ? Dec 7, 2016 02:56 |