New websitesteemCreated with Sketch.

in #development2 years ago

Finally the new website for spelmakare.se is live. I started on this project two months ago and after a month it was as good as finished, but then life happened!

screen02.jpg

src

Development

I created the website using the Preact template I had made earlier. The development has been smooth, the site could have appeared quite much the same in a much shorter time frame, but as the purpose was to practice creating a responsive web site using web components, I spent time crafting a proper re-useable project.

Most time was spent with Bulma. While a great framework, there are lots of stuff to use and wanted to try different solutions and methods. Styling always seems to take a very long time to do, it used to be because every browser had a slightly different approach to CSS (hello IE!), but these days it turned out to be because the screen size can be two inches at 320px, or 2000 inches at 1000000px. Bulma takes care of this, but you still have to learn the best approach to make everything scale and move around properly. I can't recommend the columns enough, they are magic once you figure out all the details.

I added the ability to translate the site, mostly because it was fun to do and worked well with how the site lazy loads the content. I managed to create data objects that I am quite happy with, allowing for the site to easily expand with new content. It works quite much like any store, add a new package of info and media and voila it shows up in the correct section and has a standardized presentation.

Screenshot_20181220_232117.png

src

Feature summary

  • Serverless and globally distributed to edge locations.
  • Integration of new content from numerous social platforms on the Steem blockchain.
  • Easily extended by generating pages, menus and content from data objects.
  • Possible to translate web site into different languages.
  • Is a progressive web app and can be installed on many platforms including: iOS, Android and desktop.

Links

Full site presentation
Source (less assets)

Sort:  

Hi @smjn!

Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your UA account score is currently 1.951 which ranks you at #26333 across all Steem accounts.
Your rank has dropped 94 places in the last three days (old rank 26239).

In our last Algorithmic Curation Round, consisting of 227 contributions, your post is ranked at #224.

Evaluation of your UA score:
  • Only a few people are following you, try to convince more people with good work.
  • You have already convinced some users to vote for your post, keep trying!
  • Try to work on user engagement: the more people that interact with you via the comments, the higher your UA score!

Feel free to join our @steem-ua Discord server

@smjn You have received a 100% upvote from @botreporter because this post did not use any bidbots and you have not used bidbots in the last 30 days!

Upvoting this comment will help keep this service running.

I've just noticed this. I really like how it has no pictures, but we can still understand everything instantly.

Congratulations @smjn! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :

You made more than 4000 upvotes. Your next target is to reach 5000 upvotes.

Click here to view your Board
If you no longer want to receive notifications, reply to this comment with the word STOP

You can upvote this notification to help all Steemit users. Learn why here!