Hey, so in past week I've been learning Node.js, Socket.io jade, express.
Over week I made some progress with my chat application, so here are pics (can't reveal web address yet, because it's not protected against SQL injections yet)
So anyway, I am bit shit with designing, I was wondering if anyone could give me feedback on how to improve general style/look of the chat, perhaps colors? borders, corners etc..?
This is desktop version: (1920x1080 res)
[IMG]http://i60.tinypic.com/21eco07.png[/IMG]
This is mobile version: (1920x1080 - OnePlus One, 5.5").
[IMG]http://i61.tinypic.com/zqurs.png[/IMG]
Any feedback/criticism is appreciated.
I would say to use [ t ] [ /t ] on your images url. They are big.
Bump
Have a look at how other chat rooms are designed, i am sure you can figure out part of whats wrong and what is right yourself.
Just a few things:
Remove all the whitespace betwheen text.
Don't alternate the background color of text.
Don't have a pure white chatbox, with a black background.
When viewing on a desktop that mobile screenshot seems reasonable, but irl the small screen of a mobile will most likely be too small to comfortably read anything.
Also this forum moves slowly, you don't need to bump your thread this quickly.
Why would you write a web application and not have it protected against SQL injection in the first place? It's not something you should "implement", it should be in every query you do.
[QUOTE=Cyberuben;46301922]Why would you write a web application and not have it protected against SQL injection in the first place? It's not something you should "implement", it should be in every query you do.[/QUOTE]
Because I only recently finished making main functionality because I know protecting against sql injections usually takes less than 10 mins to get done.
[QUOTE=KinderBueno;46302211]Because I only recently finished making main functionality because I know protecting against sql injections usually takes less than 10 mins to get done.[/QUOTE]
Well if it only takes you 10 minutes, why not get it done immediately?
[QUOTE=KinderBueno;46302211]Because I only recently finished making main functionality because I know protecting against sql injections usually takes less than 10 mins to get done.[/QUOTE]
protection against SQL injection should always be main functionality. It's not even taking effort, if you're using NodeJS, use "?" instead of putting the variable in your query and then pass all your variables in an array to the query function.
-edit-
If you use node-mysql at least, use this (I use pools, should work without it too):
[code]
pool.query("SELECT my_column FROM my_table WHERE my_column2 = ?", [ myVariable ], function(err, rows) {
// Your callback
}
[/code]
[QUOTE=Cyberuben;46302838]protection against SQL injection should always be main functionality. It's not even taking effort, if you're using NodeJS, use "?" instead of putting the variable in your query and then pass all your variables in an array to the query function.
-edit-
If you use node-mysql at least, use this (I use pools, should work without it too):
[code]
pool.query("SELECT my_column FROM my_table WHERE my_column2 = ?", [ myVariable ], function(err, rows) {
// Your callback
}
[/code][/QUOTE]
Oh so you just use ? to prevent sql injections?
Oh yeah and reason why I didn't do it yet is because I didnt look into it yet (how it's done on node.js)
thanks.
I found a chat design from some template on ThemeForest that you can take some ideas from. I like the tidiness and clean design of this chat layout. Take into account what the other guys in this thread have said, but here's some visual idea for you rather than just advise. The design is uploaded here: [url]http://i.imgur.com/5xBIVeH.png[/url]
[editline]22nd October 2014[/editline]
Here you are, thought I'd find another design example in case you didn't like the first one: [URL]http://i.imgur.com/ehiJy6P.png[/URL]
[QUOTE=KinderBueno;46304036]Oh so you just use ? to prevent sql injections?
Oh yeah and reason why I didn't do it yet is because I didnt look into it yet (how it's done on node.js)
thanks.[/QUOTE]
No. Question marks in a valid SQL string, followed by an object containing variables to replace said question marks is how to use [B]prepared statements[/B] in NodeJS. This can vary depending on what language you are using.
[QUOTE=TrinityX;46309785]No. Question marks in a valid SQL string, followed by an object containing variables to replace said question marks is how to use [B]prepared statements[/B] in NodeJS. This can vary depending on what language you are using.[/QUOTE]
So say I have this query:
db.query("INSERT INTO users_online (userID, username, ip) VALUES ('"+socket['user_id']+"', '"+socket['final_user']+"', '"+socket['user_ip']+"')");
How should it look with ?
[QUOTE=KinderBueno;46310330]So say I have this query:
db.query("INSERT INTO users_online (userID, username, ip) VALUES ('"+socket['user_id']+"', '"+socket['final_user']+"', '"+socket['user_ip']+"')");
How should it look with ?[/QUOTE]
That question in itself is wrong. We are not talking about using [B]question marks[/B] to improve security, they aren't some magical symbol that makes things secure. Use [B]prepared statements[/B]... Look up how to do it for the language and library you are using. I don't even want to show you how it's going to look like because Cyberuben already has shown you enough. If you want to learn, you should not be asking people to tell you how things "should look".
Been only doing a bit of styling, think this is better?
Any suggestions? The system message seems weird to me, but I am not sure how to make it noticeable but not so noticeable.
[t]http://oi62.tinypic.com/25s7qts.jpg[/t]
don't add a background to system messages. Just do
[code]
<i><b>System</b></i>: <lightcoloredstylefont>Message</lightcoloredstylefont>
[/code]
and dont use textbox for each message just make it simple and straightforward 1liner with almost no padding around message
Also post WAYWO pls
Just gonna finish up registration form right now, so that I can properly give link to the working site and post in WAYWO.
No point really giving link when there is no way to register/test yet.
This is looking nice. I have yet to give Node.js a try... but anyway, I made an ajax chat script back in the day. It's called atoChat. I found a website that has it installed in order to show you a demo: [url]http://www.hexegirl.de/chat/index.php[/url]
atoChat Project page: [url]http://atomiku.com/atochat/[/url]
atoChat v1.0 preview, nicer interface and more features: atomiku.comfiles/atochat/preview.html
It uses jQuery ajax with regular polling, but socket.js seems like a nice idea if the servers can support it. I guess it requires a server?
[QUOTE=atomiku;46368982]This is looking nice. I have yet to give Node.js a try... but anyway, I made an ajax chat script back in the day. It's called atoChat. I found a website that has it installed in order to show you a demo: [url]http://www.hexegirl.de/chat/index.php[/url]
atoChat Project page: [url]http://atomiku.com/atochat/[/url]
atoChat v1.0 preview, nicer interface and more features: atomiku.comfiles/atochat/preview.html
It uses jQuery ajax with regular polling, but socket.js seems like a nice idea if the servers can support it. I guess it requires a server?[/QUOTE]
Ajax chat looks nice, I like the colors.
Why is system there as a user? what does it do?
What I did was get a cloud hosting from DigitalOcean for 5$ a month, and install node on it with socket.io, works perfect.
Sorry, you need to Log In to post a reply to this thread.