how can I add a responsive photographer image(profile link) with like and share icon in image gallery ?

Question

How to create image gallery which indicates the photographer profile link and we can like and share etc, i need complete progress.
Please share me if you guys have any idea or source.

Answer 1

Your database design is one of the first things you should work on.
You'll need tables such as:
- user
- for authentication information such as username and salted, hashed password.
- eventually may want authentication with facebook or gmail so ids with these could eventually be added
- user_photo
- representing a photo that was uploaded by a specific user
- uploader_user_id field would be nice.
- the image data in a blob data type field
- format to indicate if it is jpg, png... could help but jpg is so good for photos that you could remove this and make the upload work strictly with jpg.
- user_photo_like
- representing who liked which photos.
- do you want people to like without signing in or having an account?
- Add a composite unique constraint between the liked photo and the user who liked it. This would clarify that a user can like the same photo only once.
- You probably don't want just a like count on the user_photo because that would mean we forget who liked what and let the same people like the same photo multiple times.

Some tips about server side functionality:
- Your image upload should validate image format such as jpg, png…
- You might want to scale down large uploads to at most 2048 pixels wide or tall to optimize storage resources on the server.

The user interface:
I would recommend Bootstrap for help with responsive layouts and font icons.
- https://getbootstrap.com/docs/3.3/components/ shows its glyph icon library which includes a glyphicon-thumbs-up, glyphicon-share, glyphicon-upload which could be useful for the like, share, and upload features.
- If those icons aren't good enough, consider also using https://fontawesome.com/
- a JavaScript library called fancybox( http://fancybox.net/ ) would help you show the images in dialogs without writing all the JavaScript and CSS yourself.

Other than that, apply your skills with PHP, MySQL, JavaScript, HTML, and CSS to make everything work together.

Answer 2

If I was somewhat new to those topics, I would build everything in small incremental improvements but start with creating at least a couple of those tables in MySQL. A tutorial at https://www.youtube.com/watch?v=nN4Kjdverzs can introduce it.

Installing WAMP would be great if you're using Windows since it comes with MySQL, PHP, and Apache HTTP Server.

There are lots of aspects to it that could be challenging but you'd learn a lot by working through them and looking up the info you need as you go.

Answer 3

Dear Josh Greig
Thank you so much for sharing this post.

I would be happy if you know any source or tutorial in order to make it works.