Hi, I'm a fairly good Java programmer, but I have basically no web development experience. I'm posting in the html forum because I know it is the most basic, but I'm sure there are other necessary tools to accomplish this task, please let me know what they are.

I want to create a website that will have the following features (these should be fairly simple?):

-One section where the site admin can post pictures. Anyone visiting the site should be able to view these pictures in two formats: "Fullscreen" where the image fills the entire screen, and "next" and "back" can be clicked to go to other fullscreen pictures, and "icon" where all the images are shown (or a good amount per page are shown) as smaller versions of themselves.

-One section where the admin can post articles. Site visitors should be able to flip from one article to the next, and view a listing of article topics and choose an article from there.

Dani AI

Generated

A short, practical roadmap tied to the replies here: correctly points toward needing a server-side component for admin uploads; highlights the value of client-side dynamic loading for smooth "fullscreen" navigation; is right that mature third‑party pieces save a lot of time. Two realistic choices will get you where you want to go.

If speed-to-launch matters, use a ready system with built‑in admin and plugins (example: WordPress). This gives article posting, pagination and many gallery plugins out of the box, plus a familiar admin UI. Pick plugins that generate responsive images, create thumbnails, and limit uploads; keep everything updated and avoid abandoned plugins.

If you want to build it yourself (good path for a Java dev who wants control), follow a minimal architecture:

  • Backend: small web app to authenticate the admin, accept image/article uploads, store metadata in a simple DB (SQLite is fine for starters), and create thumbnails.
  • Storage: keep originals and generated thumbnails (or use object storage like S3 later).
  • Frontend: thumbnail grid with lazy loading and a lightweight overlay for fullscreen view that supports keyboard and touch navigation. Use srcset/sizes so the browser picks appropriate image sizes.
  • Extras: server-side validation of image MIME/type, size limits, filename randomization, and escaping or sanitizing article HTML.

Security, performance and accessibility notes: validate uploads, serve over HTTPS, set cache headers or use a CDN for images, add alt text and keyboard controls to the gallery, and limit upload sizes. For small demos a local SQLite + simple file store is quickest; for growth choose a DB and object storage.

Example thumbnail markup (client side can attach a click handler to open an overlay and cycle next/prev):

<ul class="thumbs">
  <li><img src="/images/thumbs/1.jpg" data-full="/images/originals/1.jpg" alt="Caption"></li>
  ...
</ul>

Start with one path (CMS vs custom), get a working upload→thumbnail→gallery loop, then add article listing, paging and polishing.

Recommended Answers

All 3 Replies

You need to learn php as well , check websites like php.net , w3schools.com ,etc .

PHP is not completely necessary, but it can be useful. You could also do the page with AJAX, so it would be useful to learn JavaScript and XML.

Member Avatar for Member #120589

You'll be better off using third party scripts. Probably best not to reinvent the wheel. The functionality can be produced by php without js/ajax or by js/ajax without php. Howeber, most 3rd party scripts (the good ones) use both technologies. A basic understanding of each would be beneficial. One good thing is that js and pHp are very similar (well, I think so anyway). I found HighSlide to be pretty good for this - a typical LightBox app.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.