Over the past year, I've become a bit wiser with some professional experience under my belt and thought of implementing the same idea with different technologies and using best practices, example: the previous version hosted on AWS had security policies set to everything open from everywhere and no SSL certificates. Yes, I've wised up now.<p>Would love any feedback, especially if you could do a quick code review on my Go and React code!
React: <a href="https://github.com/SalmaanP/FastNews-Frontend-React" rel="nofollow">https://github.com/SalmaanP/FastNews-Frontend-React</a>
Go: <a href="https://github.com/SalmaanP/FastNews-Backend-Go" rel="nofollow">https://github.com/SalmaanP/FastNews-Backend-Go</a><p>For Comparison the previous layout: <a href="http://52.34.237.199/" rel="nofollow">http://52.34.237.199/</a>
Looks pretty good, there were a few design things that bugged me.<p>1) Setting your text to evenly space the words across each line makes for a terrible reading experience. Reading on mobile the amount of space between some words was painful.<p>2) I think this would look better if you aligned your margins on everything. Basically have an overall margin for the page and have everything run up right against it.<p>3) Get rid of the margin around the grey header on your content boxes and have everything in your content boxes an equal distance from the edge.<p>4) In two-column mode I'm seeing the left column is much wider than the right column and the content boxes are of differing heights. I think this will look better if you make all the content boxes equally sized.<p>Actually, I just tested again and now (on my Galaxy S6's landscape mode) it is showing three equal columns that break the page. The header no longer reaches all the way across the screen and the third column abuts the edge of the screen.<p>6) Align your menu button to the right and your title to the left.<p>5) In your menu I think your selection outline and your search bar should be the same width with aligned edges.
Nice, really fast and simple!<p>One thing which bothers me though is the whitespace in the rows. How about using css to collapse the white space like bootstrap4's card-columns:<p><a href="https://v4-alpha.getbootstrap.com/components/card/#card-columns" rel="nofollow">https://v4-alpha.getbootstrap.com/components/card/#card-colu...</a>
It's cool, your folds are not tall enough to show the full headline or numbers sometimes. I think the content could be shortened or font size decreased until user asks for zoom. Overall very nice organization, style, boundaries, layout. Would like to see more focus on "broad view of all topics" and then "zoomed in detail of one."<p>Top bar needs some sort of color to draw the eye to the presence of fresh page content.