Noob web developer wants to add web design and interaction [closed] - javascript

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 8 years ago.
Improve this question
I'm sure this question has been asked but it's hard to just google specifically for what i'm looking for.
So, basically I'm already comfortable with OOP and computer science from college material. Now, I'm trying to learn web development and already have the basics of HTML, CSS, and some django (which is what I'm using to make the website).
Now, I know CSS is for kind of designing how the website looks. And javascript can help add animations and extra stuff. Then I've heard so much more stuff like AJAX and javascript (maybe someone could help give me a list of all the tools that are for design: AJAX, javascript, javascript libraries, etc.).
Basically, my main question is this: Anyone have any recommendations for how I should approach learning this material?
(Like, should I try to pick up javascript and learn some of the libraries that are often used? or... maybe I have the wrong idea of what javascript does)
EDIT: So it's been over a year since I've been doing web development at a job. I learned the basics and that post I marked as the answer has defnitely been helpful. But now, I feel like the best way to learn ANYTHING in terms of making a web is to throw your ideas all into your head and then google to understand what tools you can look for and use to materialize those ideas. For example, my post was about "web design and interaction." As a web developer, that's not my job so obviously something like twitter bootstrap helps. But there's also other front-end plugins and tools, it's helped me just to google and look them up to find what I want done. I feel like that's the best way to approach "learning this material"

Check out http://w3schools.com/ they have great tutorials for beginners in the areas you have mentioned and more.
The interactive tutorials on Code Academy are great
HTML/CSS: http://www.codecademy.com/tracks/web
JavaScript: http://www.codecademy.com/tracks/javascript-upgraded
Hope these help.
Good luck getting into Web Development.

For learning Javascript (and a few other languages), I'd suggest Codeacademy.
AJAX is just a way of using JavaScript to load content or changes dyanmically.
jQuery is the most popular JavaScript library, which, if you already know CSS selectors, can be quite easy to get to grips to as they have a very useful api library.
Following web blogs such as Smashing Magazine and CSS-Tricks is very useful, as they offer tips and solutions, and just generally make the web industry exciting.
Edit:
The standard starting points for building a website are:
HTML5 Boilerplate - A great blank starting plate that offers a very optimised blueprint, with lots of fixes of known browser bugs and tips.
Twitter Bootstrap - Similair to HTML5 boilerplate, and most people use a mix of both, this bootstrap is a great way to get a website together quickly, and has options for making it responsive.
It really depends how you find best to learn, personally I like to get all the basics learnt through video tutorials, and then just push myself with my own projects, and just research when I hit a brick wall.
I'd say for a good starting point TutsPlus have some very good tutorials, in particular:
30 days to learn jQuery
PHP Fundamentals
Generally any of their courses to be honest
If you fancy an all-in-one solution - TeamTreehouse are great.

Related

really struggling to find the next path to develop my javascript knowledge

I have completed codeacademy twice, freecodecamp twice and read a few online articles...I believe I now have a good understanding of the fundamentals of Javascript.
However, I feel lost in terms of where to go next. People say build projects, but where do I start? How do I plan? Even though I know the fundamentals of Javascript, I still feel there is a lot to learn. I feel like I will only truly start understanding Javascript once I start putting projects together but I cant think of any.
Also, codeacademy, freecodecamp and these other online course websites dont seem to really teach DOM manipulation. Is there any online coding sites, similar to the ones mentioned, which will allow me to practice DOM manipulation?
I would be hufely grateful if people who have developed their understanding in Javascript can give me some advice based on how they did it.
I am just sitting here staring at my laptop and going back and forth. I cant really seem to figure out what to do next, now that I have gained a basic understanding of the core concepts of Javascript. Please guys, help!
This is not a very good question, but I still would like to try and explain.
Questions you need to ask yourself
Frontend or backend js?
I assume frontend based on the "DOM manipulation" part, but there is also Node.js for the backend with it's own unique API to use and interact with the operating system.
Do I want to use libraries and/or frameworks
Depending on your needs and preferences you will come in touch with these things, they all have their own learning curve, on top of learning js. Libraries are mostly just function in order to help you. However frameworks like Vue and Angular require a way of writing your code that is like it's own language. (opinionated)
What version(s) of js and browsers do you want to support?
Javascript has evolved over time and the javascript engines in browsers as well. Older IE browsers will be harder to support without the help of a library like jQuery.
Now about the learning part and where you can practice.
There are probably thousands of great sites to practice, however I will give you my favorites.
The stackoverflow documentation on javascript (top navigation on this page)
I will get hate for this: W3Schools
To read the docs on Mozilla
interactive on both codeschool and codeacademy
JSFiddle for practicing in a closed environment
https://bento.io/topic/javascript
https://learnxinyminutes.com/docs/javascript/
http://www.allitebooks.com/ for specific ebooks
Have a look at what frameworks are popular nowadays and why. If they suit your needs. Learn them one or two at a time but not more, so you won't mix them all up in the end. Try to at least understand OOP in javascript even if you don't intend to use it later. Anyone feel free to expand this answer because it is hard to cover it all myself.

I'm failing to understand Aurelia architecture

I was hoping someone could shed some light on the Aurelia framework for me. I've noticed many posts out there promoting this framework so I've decided to take a deep dive into it. Though I've had some issues right off the bat with getting starting while reading through their Doc HUB. I see many subjective claims and not very much code. Or diagrams for that matter. Sorry, I might be the visual learner but I think by having something that is "tangible" (as much as the Web could allow) would help people like me adopt this framework.
Now architecture patterns!
Taken from Aurelia Docs: "MV* with Conventions" or use "jQuery, React, Polymer, Bootstrap, MaterializeCSS and much more."
MVVM or MCV? Well why not MV*!
Forgive me, but I don't consider Bootstrap a framework in this sense of the word. How would I just use Aurelia? Do I get to decide what architecture I want to use and not pick or piecemeal several ones together? Why is the star there? Is this just me over thinking this or should it be as MV(C | *)?
Also, I've yet to actually write any code using Aurelia and so this question may be easily answered by just trying to use it. I would truly like to see more code out there for this framework. Maybe that would ease my visual brain sponge monster.
Thank you to whomever response to this silly question of which could have easily been answered if I had friends.
Here are some answers based on my opinion.
Why is the star there?
The * means "whatever". It could be MVVM, MVC, etc.
[...] I don't consider Bootstrap a framework in this sense of the word.
Yes, you are right. In fact, jQuery, React and Bootstrap are not really frameworks, but some say that Bootstrap is a "Visual Framework" or "Design Framework". The problem is that the term "framework" is a little vague and could be easily confused.
What the docs wanted to say is that you can use Aurelia with any other libraries that you like. You are not limited to anything.
About the patterns, I think you should see these resources:
Contact Manager Tutorial http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/contact-manager-tutorial/1
A list of apps written with Aurelia (Source-Code Available) http://builtwithaurelia.com/
Official Chat - https://gitter.im/aurelia/Discuss - This one is the most helpful for you. You can talk to a lot of people and ask many questions as you want. I believe all of your doubts will be answered there.
I hope this helps!

How to learn PHP, Jquery, Javascript, in smooth way [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
im taking classes for programming for about 1,5 years now and started from 0. I must say for my feelings I already learned allot but still it is not enough to build anything complex on my own without using examples from the internet that I just modify and try to make it work.
I did some courses on CodeCademy and watch youtube guides and google allot, use certain websites like w3schools and more of that. But what is the best method to learn any givin language in a propper way. Im spending allot of time on searching and reading things that I never seem to fully understand, only sometimes some parts of it.
It does make me lose the hope that I wil ever be a good programmer and feel demotivated.
What are your expiriences and tips and tricks for a beginner like me ?
This question is rather opinionated, not sure it is suitable for StackOverflow.
For what its worth, this is my advice:
Ask lots of questions, make lots of mistakes and build things, keep challenging yourself. Never give up. Also, learn to use some frameworks, for PHP, Symfony, Yii, CakePHP, for example. For JavaScript, Angular, Backbone, Node.
PHP Manual and JQuery documentation are your best friends :)
Also, install a testing server on your local machine such as XAMPP.
Good luck!
I was in same situation as you before.
As mentioned already contributing to project is a good way to learn as it will give you motivation to push yourself forward and do it because you don't want to let your team down.
Another great way I have found for myself is to create a small projects yourself, for example:
I want to create my own website, what do I need? I need to know: html, css, js and php.
Okay so start with what I can do.
When you reach PHP and JS part, you will face problem which you can break down into smaller problems it will also develop your problem solving skill in IT.
As an intermediate programmer myself, I would say the best way to learn is to continue finding resources online and communicating with other programmers or developers.
Some words of advice:
1.) Never be afraid to ask for help
2.) Don't feel discouraged, feel inspired
3.) Believe in yourself
Also, this website is probably the best resource I've found, both for information and kind people.
You must have some idea's of something that you yourself miss on the internet. Start with that, work out that idea as a concept and then start it.
Read a lot of IT-related news items; they might inspire something for you to start thinking about doing.
Contributing to projects has already been mentioned, but I'll do it as well. It has many advantages, not in the least having people in the project focused on achieving whatever the project has set out to do, which might give specific insights in that field of the wild internet.
Get a part-time job at a web-developers company, it doesn't have to be big, but it does offer you opportunities to learn specific areas. There's always work in the IT sector.
Also, troll along the questions asked on Stackoverflow, see if you find something that might challenge you and go attempt to answer it. The questions are usually abstract enough that you can replicate the problem someone is having, then try and document your solution for them.
In my long (yet short ;-) ) programming experience, it's a matter of perspective. Some learn better learning the whole theory from books and then applying examples, and then making sample projects. In this case use JQuery, PHP and JavaScript tutorials for basic concepts and then make some examples of the methods, and then, try to make a project on your own. But then again, this is one perspective.
The other and it's been kind of direct to me, it's that if you have already some basic programming skills, go ahead and do something you like. When you have doubt about doing something, google it, read docs try, and try again. Why this is smooth? Because even though it's not as fast, the experience will remain solid. If you're the practical type of person, you won't easily forget when you learned something out of try & error.
There are other perspectives, but I'll leave it from here. I wanted to be helpful somehow on this because I had this same question before. But, faithful to the rules ^^u (yeah, rules... ¬¬u), if it's a question that derives from perspective, debate, or recommendation (like product benchmark, or best educational way of learning something) then should not be addressed here. A specific question for an specific answer. Try to make it specific, and search in the similar question matches just in case. Good luck =)

How should I create a web interface for my application? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
First, a little background: I have written a little application in python with SQLAlchemy, which is roughly an improved RSS reader: it selects links that should interest the user, and shows them to him. I already have a very simple command-line interface, and I envision a variety of interfaces: web, instant-messaging, desktop...
For now I'd like to create a simple web interface, but I have absolutely zero experience in the matter (appart from making a simple php forum 5 or 6 years ago...). So I'm comming here for advice on where to start:
Is there a good tutorial on HTML/CSS/Javascript focused on making a website look good simply? I know about w3schools, but it's a terrible tutorial IMHO, since it teaches you about HTML/CSS but doesn't show you how to use them.
Should I use a javascript library? Which one?
Should I use a web framework? I'm guessing either not or a very lightweight one, since I already have an application core with a database and SQLAlchemy, and I don't want to drop it.
Any other advice?
Thanks!
I recommend that you use some kind of web framework, it will make things a lot easier. Since you already know Python you should look into Django framework. It seems that you can use SQLAlchemy with Django, see djange-sqlalchemy project.
I recommend using JQuery framework/library for Javascript stuff. It greatly simplifies coding and takes care of most web browser incompabilities.
This CSS tutorial seems to give you the basics.
I would start by reading the Django tutorial and start trying things out. I wouldn't worry too much about HTML stuff, you should be able to pick up enough from Django tutorial. Make your site first functional with HTML, Django and SQLAlchemy. Only then start worring about Javascript. Who knows, maybe you do not need Javascript at all?
Do not try make your site work and look good at the same time. When you are making your site work, use simple and ugly HTML pages. When you are making you web site look good, work only with static HTML pages and CSS files. It is easier to combine the two in the end.
Just like everyone else here, I'll chime in with "Use my favorite framework, because it's what I use...."
I would start with small goals for a web interface. Get something simple up and running that to make sure you understand how things work.
Write an app that responds to the following url and returns something.
http://localhost:8000/my_links
Once you understand the little bit of machinery it takes to make that possible, what is handed to you as far as information about the request, and what you need to produce to return to the caller, it should be come clear how to fill in the blanks to get from your existing application to data thrown at the web browser.
Learn WSGI for no other reason than most of the libraries that will help you build a web application utilize this to some degree.
One of the links from the above page that I found extremely beneficial in understanding how all this works. was Ian Bickings article "A Do-it Yourself Framework"
Once you get a grasp of that stuff, you may find that dealing with WSGI at such a low level is maybe a little too cumbersome. That's when you'll probably want something like WebOb
which is just one of several ways people have come up with for abstracting away the low level details of the request/response cycle into some convenient objects. In a sense encompassing the HTTP protocol without trying to make it make sense to someone who doesn't want to know what HTTP is.
Depending on the complexity of your application you may decide that handling a request, looking at the path and dispatching off to one of many functions is a drag you'd rather not deal with. This is where everyone's favorite framework starts to be beneficial. And I would suspect that you would know enough by this point to better assess the frameworks that are out there and determine which fits your needs and goals.
Lots prefer django, maybe you will too. Others prefer Turbogears, and or Pylons, maybe bfg, maybe grok, maybe zope, maybe plone. But no one here knows what you want your application to do.
It's an interestingly common mistake: all of the above answers provide technological advise on what's the best technology to do ... what exactly? You should work the other way around.
I think that if you want your application to be successful, you have to make sure it enables its users to get the most out of it in the most natural way to them.
Therefore, i suggest you first "storyline" how things should happen from a user's perspective. Use paper and pen, or more sophisticated wireframing tools such as balsamiq mockups.
So, first lay out what the experience should be, and this will tell you which technology will be the best choice to enable that experience.
Oh, and don't forget to read this.
HTML, CSS and JS Book: DHTML and CSS for the World Wide Web
Javascript Library: JQuery
Web Framework: Not sure, DJango?
Other Advice: Learn to write HTML, CSS, and JS in a a simple text editor with syntax highlighting. Complex IDE's are cool, but for this stuff, they will make you learn slower.
Web applications are not simple.
HTML and CSS: Head First HTML is probably a good starting point. The Head First series are usually excellent tutorials. As Josh said, write your pages by hand.
Javascript: you don't need this to get started. Maybe in a later version. When you have a better idea what you'll need Javascript for, you'll be better equipped to pick a library that suits your needs.
Web framework: You should probably start with Django. That's the opposite of a "very lightweight" framework, but in this context "lightweight" requires more expertise to make something polished. So it's a good idea to aim for "feature rich and well supported" instead.
Here is another option, I feel it's worth mentioning before making any decision.
As web framework I would advise web2py, it is very easy to setup and yet powerful. Here is a document showing the differences between Django, web2py and some others. It is somewhat old but will give you a good overview.
Since you have legacy code, if you really want to keep it there is a fair compatibility between the two although you should double-check. The easiest would be to adapt your code, of course, the differences aren't so big. But that's your call :-)
Regarding the Javascript library, probably jQuery.
The best introduction you could follow is the opera web standards curriculum. Some of the information will be too basic - but a full understanding of all the topics covered will give you a very good grounding.
http://www.opera.com/company/education/curriculum/
Alternatively team up with someone who specialises in front-end development.

Javascript library for building desktop-like web application: ExtJS, jQuery, YahooUI, Mocha, SproutCore, Cappuccino, others? [closed]

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 9 years ago.
Improve this question
I am evaluating several Javascript UI toolkits for building web applications that have a desktop-like feel, mainly because of dialogs and window management.
I looked at several options - here are my evaluations so far:
ExtJS - Great widget library, great docs! Not so great license.
jQuery UI - Lack of ready-made window and dialog containers. I love jQuery though.
Yahoo! UI - Same problem as above. Really mature (but, unfortunately, is no longer being actively maintained) and well documented.
Mocha (Mootools-based) - Not as mature as the others. Lacks good documentation.
SproutCore - Same as above. Also doesn't have window and dialog widgets.
Cappuccino - Too weird and revolutionary.
What's your take on these? Are my evaluations correct?
In terms of a desktop look/feel the best of that bunch has to be ExtJS. In terms of the UI it really is leaps ahead of the rest. Of course there are licensing issues but they have their FLOSS exceptions and if you intend to make money from the project then a commercial license isn't exactly going to break the bank.
Other Very Rich Framework worth looking at (all have their good and bad points),
Bindows
Tibco General Interface
vegUI
Echo
Have you thought about GWT (Google Web Toolkit http://code.google.com/webtoolkit/ )?
I love jQuery, plus its been adopted by M$ for MVC. I wouldnt call the lack of ready made stuff a downer. Yeah it would be great if there was, but with things like that i always find you end up bodging them to fit your needs, just write you own, its so easy to!
YUI is very great at UI, except that the syntax is a little verbose, but hey, there are enough documentation on yahoo! site to get thing done correctly!
You could give a try to jQuery Desktop or ExtJS.
If you want it to look like and work like a desktop app, I would choose either Yahoo! UI or Ext.JS
I have been using ExtJS for some projects lately. It's learning curve is a bit steep, since you'll have to grasp their concept of layouts, but other than that you'll be fine.
Just make sure that you read the licensing agreement before you start using it. Oh, and ExtJS works fine using jQuery, Prototype and others.
ExtJS is probably the best choice. It's fast, it's lean and it's damn beautiful.
Their support is also excellent.

Categories

Resources