I am new to Angular and I have a question.
When creating a page which utilises smooth scrolling to capture sections from nav, what would your advice be? Would it be to have each section as separate components? If so why would that be the case and if not what would be an ideal way of doing it?
Basically yes but not necessarily. Because if the component can be reused in multiple places,should always create a separate reusable components.
Related
Trying to make a react app using pre made sources. I have a fully functional web page made in vanila js. Is the best approach (or maybe the only one) to turn the html page into multiple react components and just delete the html page or should I maybe find a way to just implement react code into html?
Why write 5 times the same button when you can write it once and import it the rest 4 times? This assures a unified look on your site and that any minor change you make will be reflected in all the proper places.
Consider a testimonial slider. You want this in your home page and in your about page. Why have the need to update it in two places?
If you are going the React way I will suggest to go all the way. Componetize your site, see the true power of React. Maybe its an overkill for your site (every component appears once -doubt-) but if this is the case you will start learning a really powerful tool with a simple example and the progressively get better.
New to React and wanted to get some insight on how best to create a website that will eventually have many SPAs, developed by different teams.
Ideally, a team would want to create a new SPA, and they would be able to add some stuff to their SPA that would allow for their site to share a common look/feel and perhaps navigation as well.
I am envisioning this where there is a master navigation (header, nav menu, etc) which I control, and many of these link into sub-pages that are actually stand alone SPA pages. But if we want to share things like settings, permissions, layout scheme, is there a tried and true way of doing this?
I am a veteran web developer who is really new to the Angular or React ways. In the day I would just create a frame, or, have a header that was a server-side include of sorts. But I feel as though things might be very different or more sophisticated now.
The goal here would be if we wanted to change the look/feel scheme, or wanted to change the master header/nav, we wouldn't have to update all of the SPAs individually to do that. So this is more than how to create a SPA (which is very well documented), but more of a "as a firm what can we do to centralize and house all of our team's web apps?"
Thanks in advance
You want to look into "Higher Order Components (HOCs)" in React. Basically, you will define a Layout inside a React Component (let's say you create /src/components/Layout/Layout.js), there you import your Header(.js) and Footer(.js) components and put {props.children} in the middle (this is where content of routes gets rendered.
But before you can do that, you should learn how routing, nesting components, props and stuff work, or else what I wrote may not make much sense.
I'm new to AngularJS and would definitely benefit from experient AngularJS developers! So here you go :
In AngularJS what is the difference in terms of performance of using ng-view (with router) or a custom directive to display templates (HTML partials) ?
How big should be a custom directive ? From what I see a custom directive could substitute a view entirely but should it be used that way ? There might be benefits and drawbacks using one or the other.
What would the be the rules of thumb to use one or the other ?
Many thanks in advance !
I think the performance aspect of the question is kinda a moot point. Let's use the idea of a table and a number of table rows. Unless you're generating 100s of rows of data utilizing custom directives or loading template, you're probably not going to incur any noticeable performance penalty. Angular caches templates so it's not like it's loading the same template over and over for each row. If you are generating large number of rows, then there are performance tweaks and different UX approaches you can utilize to address those issues (e.g. track by for ng-repeat, endless scroll, pagination, etc.)
How big should be a custom directive?
As you stated, you could use a directive to make an entire view. I think in Angular 1.*, that was not its intended functionality. A directive was more like a widget or UI Component (for those directives that are mostly UI containers with specific UX in mind, we're not considering non-UI type directives in this discussion obviously).
My rule of thumb is this:
If the UI in question has some ownership of a URL (aka. route) then treat it as a view. Generally a URL is unique visually speaking, so directive-ifing it will only create more work and little pay off.
If the UI in question works more like a widget/uicomponent, then use a directive.
If the UI in question is going to be reused over and over (e.g. inside ng-repeat) then a directive should be considered if isolating certain work on data it is consuming will be performed.
All of these points get complicated by the intended UX. But the rule of thumb provides a good starting point.
Keep in mind, Angular 2 is going to change all of this up by nixing scope and treating directives more like views.
I want to have a block oh html across all my templates (like a sidebar for basic form submissions), which is easily implemented on the html files by using blocks.
However, my doubt is not about the repetitions across templates, but across views. Since the functionality will be the same across all templates, it would be really boring (and bad programming) to define the request handling (that would come from that side bar's submissions) for every view I have! How should I handle this? Should (and can) I make a view dedicated to handling that "all-around" part of the template?
Any advices are welcome,
Thanks in advance
Daniel is refering to an Inclusion Tag
Basically, a custom template tag is used for scenarios like yours (... code reusability amongs many other advantages)
Also this post might be helpful: Django Custom Inclusion Tags
Another approach could be using template inheritance - create a base template, which defines the layout, and override the blocks of code that would change for specific views.
Here is an example of template inheritance: https://docs.djangoproject.com/en/dev/topics/templates/#template-inheritance
Use a custom template tag - probably an inclusion tag.
This might be a general question, but I can't seem to figure it out. What are containers in DNN? Skins are essentially a layout plus a colour scheme for the whole portal. So are containers the skin for desktopmodules?
Sorry if this question is novice. I am not confident in DNN yet, and am reading the doco. However i need this answer quite quickly.
Cheers.
Containers allow you to add style and markup to any module independently of the page skin or the particular module.
The layout goes like this:
Default.aspx
Skin (.ascx control, either the
Portal default or selected on the
given tab) - this has panels on it
Container (.ascx control, this can allow you position some edit
buttons and have a configurable wrapper around any module)
Module (.ascx control, usually coming from /DesktopModules)
I hope this helps,
-Eric
Yes, container is like a skin for single module. Using one skin for entire page, and several skins (container skins) for modules you can quicker create expected appearance.
In general this is a simple html snippet with several placeholders.