Now tap the shift key twice. It'll pop up omni completion. You can type any partial filename, any partial symbol name, etc, and it will take you to it.
Note the ten thousand quality of life improvements. Example: when looking at a CSS file, #ff0000 will render with a red background color. (The background color of the text is literally the color that the text represents.) And clicking on it brings up a color swath.
Changes appear on your website as quickly as you can type. When you're editing solely HTML and CSS, there's no such thing as a refresh. No need. You just type.
It's a bit hard to tell, but webstorm has deep awareness of what your code represents. Notice the tags like "description", "moduleDef", "assertion", etc. Those are hints about what each function expects.
Want to see documentation? Hover your mouse over any symbol. For example, hovering over "it" gives:
I could go on for days. You may have heard of the Brackets IDE, but in my opinion webstorm completely wipes the floor with them. Live Edit (hot reload) is far better... Actually, rather than list out ten things, I'll just say "everything is far better."
Not everything I've demoed here is turned on by default. You should expect to put a day or two of work into configuring your editor. But once you do, you'll be a monster of productivity.
Have I mentioned that Webstorm has a Vim plugin? Preferences -> Plugins, "vim", search, install, done.
Interesting that there is no mention of eslint. I've always found that the best way to learn a new language is to immediately install the linter and its associated plugin for whatever IDE you're using for instant feedback about potential anti-patterns / dangerous code while you work. Also curious that there's no mention of typescript: a lot of companies have already made the transition because it makes huge projects much easier to manage and read.
When it comes to typescript, however, I believe that it's better to learn pure javascript first. Understanding -why- typescript is useful has a lot of value, and saying that you know typescript without having spent time using javascript would raise all kind of warning flags during an interview (focus on what's cool/trendy over deeper knowledge and a lack of desire to fully understand the environment in which you work, to mention some).
Also, a beginner frontend developer who reads a list of HTML tutorials will probably not spend a lot of time in "huge projects" in the beginning of their career.
That's understandable, and to some degree a good decision. But then eslint sometimes help you understand why something is broken, which is especially beneficial to beginners.
Whether to include eslint or not may be worthy of discussion, but since both options have valid points I'll be happy to leave this discussion as is.
Thanks for linking to our newsletters! Just one note, the internal link at the top goes to anchor "newsletter" but it's missing the "s" for the link to work. I'll do a PR later if you don't catch it.
Awesome, I subscribed these newsletters since a long time. Really good job! I'm always recommending these newsletters to my team / students. For people who don't spend a lot of time doing research (some students and professionals I know), it's a great way for them to have a short "overview" of what is happening and which articles are more interesting at the moment. Please keep it up!
As an Englishman, I think it's probably for the best. No-one would recognize the English flag anyway, and the UK flag looks kinda bleugh at small sizes.
Sure, and I'd like to learn it I guess, but I'm too busy looking at interesting stuff in frontend like working with audio and getting webgl things happening. Frontend has diverse meaning these days.
Yes, but that list is really for beginners, people that didn't have any experience in programming before. Another list with much more links will be published in the same format soon.
Try webstorm:
Then run `webstorm foo/` to open the webapp located in folder foo. It works with basically every type of webapp in existence.It'll look like this: https://i.imgur.com/z2euynI.png
Now tap the shift key twice. It'll pop up omni completion. You can type any partial filename, any partial symbol name, etc, and it will take you to it.
Note the ten thousand quality of life improvements. Example: when looking at a CSS file, #ff0000 will render with a red background color. (The background color of the text is literally the color that the text represents.) And clicking on it brings up a color swath.
Changes appear on your website as quickly as you can type. When you're editing solely HTML and CSS, there's no such thing as a refresh. No need. You just type.
Here's an Angular 2 project (https://github.com/preboot/angular-webpack):
https://i.imgur.com/vb4uDMw.png
It's a bit hard to tell, but webstorm has deep awareness of what your code represents. Notice the tags like "description", "moduleDef", "assertion", etc. Those are hints about what each function expects.
Want to see documentation? Hover your mouse over any symbol. For example, hovering over "it" gives:
https://i.imgur.com/4Xv4BMb.png
I could go on for days. You may have heard of the Brackets IDE, but in my opinion webstorm completely wipes the floor with them. Live Edit (hot reload) is far better... Actually, rather than list out ten things, I'll just say "everything is far better."
Not everything I've demoed here is turned on by default. You should expect to put a day or two of work into configuring your editor. But once you do, you'll be a monster of productivity.
Have I mentioned that Webstorm has a Vim plugin? Preferences -> Plugins, "vim", search, install, done.