Announcement

Collapse
No announcement yet.

Modern Scholarship - Web Development

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • #46
    Well, if/when I do get some time free from the current grind from my 'day' job, and have a go at some of this stuff, I will post an update on here. Maybe we can do this project in a couple of months time or, if you have progressed beyond it, a different CS challenge. I really liked the Arduino/C course from Coursera as it was one month long max and really well paced, ie a couple of hours a week would do it, or a whole weekend if you really went at it. I'd be looking for similar length courses on aspects of web dev.

    For CS fundamentals, I have not done this whole course, but I watched the first couple of lectures. They are long (an hour I think) but the lecturer blew me away with his enthusiasm, showed me how these Harvard types are different class:
    An introduction to the intellectual enterprises of computer science and the art of programming.

    Comment


    • #47
      In case it is of interest, and for those who might know, the next thing I have to learn and use for work, is JSP. I have found a good tutorial online for it I think, and a good book, but am not too far into it. I am wondering if I could come at this website challenge and try to write one in JSP? (I don't know if that is wise or possible, ie is it lightweight enough for an individual to do that, or is it the sort of thing that only a company would use to write their website)? Better yet if I can do it and learn an MVC platform at the same time.

      Failing that, Andrew I have quite a clear plan for my studying now, and I do reach HTML, CSS and Javascript at some point so maybe we can talk again about a challenge in those at that point.

      Comment


      • #48
        Viewport Unit Based Sizing

        I recently learned about a CSS feature that allows you to size elements on your page based on the size of the viewing screen/window:

        I talked about using rem and em for responsive typography and for building modular components in two blog posts previously. In both posts, comments about viewport based units inevitably comes into the picture. I resisted working with viewport units for a while, believing that using them would be a pain in the ass because of the calculations involved. Last week, I finally overcame the resistance and took a stab at exploring viewport units and how to use them in responsive typography.


        Thus far it looks like a really useful tool for simplifying mobile-responsive layouts, since every element whose size you define with one of these new measurements will automatically resize based on the viewing window. To test it out I used it to build a simple one page site. If you resize your browser window, everything on the page will automatically resize. The downside of using only, say, the "vw" unit (percentage of viewport width) is that on a desktop screen everything can start to look too big if the browser window is expanded fully, and it could look too small on a phone. But, the link above explains an easy fix for that.

        Here's the site I made:



        It's still best to have one page layout for mobile devices and one for computers, but this should really simplify the process!
        Love, and do what you will.

        - St. Augustine

        Comment


        • #49
          Grid Layout

          Has anyone built a page using grid layout yet? I just watched this presentation from June of this year about it, and it is a HUGE step forward in making designing pages easier and better.

          CSS Grid is now live in all major browsers, and with it everything we know about web layouts changes! The CSS Grid Layout Module introduces a native CSS grid...
          Love, and do what you will.

          - St. Augustine

          Comment


          • #50
            Originally posted by Andrew R View Post
            Has anyone built a page using grid layout yet?
            Grids are a very common pattern in laying out the page - all the major frameworks use them. The idea itself is not new at all: it was borrowed from the newspaper publishing industry that lays out printed content in a grid. Even back in the bad old days when everyone was laying out web pages using tables it was still the same basic idea (although the term "grids" was not invented yet).

            Modern frameworks allow for an incredible amount of flexibility with responsive grids:

            Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.
            George / Юра
            Shaolin Wahnam England

            gate gate pāragate pārasaṁgate bodhi svāhā

            Comment


            • #51
              To clarify I meant has anyone active on this forum built a page using grid layout, but without a framework like bootstrap? The person that gave the presentation I linked to was very excited about the new "display: grid" option since it allows for fully responsive, easy to design pages using only HTML and CSS, no framework necessary.
              Love, and do what you will.

              - St. Augustine

              Comment


              • #52
                I generally use flexbox rather than grid.

                Comment


                • #53
                  Originally posted by Andrew R View Post
                  To clarify I meant has anyone active on this forum built a page using grid layout, but without a framework like bootstrap? The person that gave the presentation I linked to was very excited about the new "display: grid" option since it allows for fully responsive, easy to design pages using only HTML and CSS, no framework necessary.
                  I should have watched the video first... CSS Grid looks cool and the video is very good.
                  George / Юра
                  Shaolin Wahnam England

                  gate gate pāragate pārasaṁgate bodhi svāhā

                  Comment


                  • #54
                    Has anyone built a page using grid layout yet? I just watched this presentation from June of this year about it, and it is a HUGE step forward in making designing pages easier and better.
                    - I've done a lot of Joomla websites which use bootstrap grids (since J version 3.0).

                    In my experience, bootstrap is nice for beginner developers or those who wish to make a functional, scalable website fast. Personally, I usually leave it and opt for basic CSS instead, which gives me more control over things.


                    All the best,
                    Markus Kahila
                    Shaolin Nordic Finland

                    www.shaolin-nordic.com

                    Comment


                    • #55
                      Originally posted by George
                      I should have watched the video first... CSS Grid looks cool and the video is very good.
                      It's a good time to be learning CSS, I can bypass all the hacks/workarounds people have had to use and use this new grid system.

                      Markus Sisook, the Winter Camp site looks great. If I read the DOM correctly you used Bootstrap to build it, is that correct?
                      Love, and do what you will.

                      - St. Augustine

                      Comment


                      • #56
                        Originally posted by Alex McLeod View Post
                        I generally use flexbox rather than grid.
                        All of my design-savvy coworkers prefer flexbox, too. I believe that at least react native also uses flexbox-based styling, so that's an added bonus for anyone who is interested in learning to write mobile apps (which is of course beyond the scope of this thread's current focus, but still worth being aware of)
                        Chris Didyk
                        Shaolin Wahnam USA


                        Thank You.

                        Comment


                        • #57
                          I generally use flexbox rather than grid.
                          All of my design-savvy coworkers prefer flexbox, too.
                          I haven't learned flexbox yet, what draws people to it?
                          Love, and do what you will.

                          - St. Augustine

                          Comment


                          • #58


                            A game for learning CSS flexbox


                            I'll just leave these here.

                            Comment


                            • #59
                              Originally posted by Grimlock View Post
                              All of my design-savvy coworkers prefer flexbox, too. I believe that at least react native also uses flexbox-based styling, so that's an added bonus for anyone who is interested in learning to write mobile apps (which is of course beyond the scope of this thread's current focus, but still worth being aware of)
                              I tend to use React as well...

                              React and React Native both just use normal (ish) CSS, so it's entirely a matter of taste. Since a component is the base building block, you only tend to look at what's inside the individual component, and their parents put the children where they go. That means you tend to work in one dimension at a time, so no need for grids.

                              Comment


                              • #60
                                Originally posted by Alex McLeod View Post
                                Nice

                                My take on Grid and Flexbox is that they are both useful, depending on your circumstances. Grid does allow for significantly more advanced layouts than Flexbox but that was rather the point of the feature. Considering that it only really became available for use in the last couple of months and that it introduces an entire new way of thinking about layout I expect it will take some time to sink in to the wider developer community. Flexbox has been usable for longer and it solves a more familiar problem. It is also entirely reasonable to use them together if appropriate for your needs (e.g. a grid of flexbox containers).

                                With both (especially Grid) you still have the problem of supporting IE users (Windows 7 and 8) which may or may not be a concern for you (I explicitly make it not a concern for myself, but not everyone has the luxury). That said, the idea in the video that Andrew posted earlier about serving default mobile layout to legacy browser users was an interesting one and I may well take it on board.

                                For the purposes of this thread though, learn them both - they are the future.
                                Last edited by George; 18 October 2017, 11:02 AM.
                                George / Юра
                                Shaolin Wahnam England

                                gate gate pāragate pārasaṁgate bodhi svāhā

                                Comment

                                Working...
                                X