search

ucsb / webguide

Repository for the UCSB WSG Webguide hosted on Github using Jekyll.
https://webguide.ucsb.edu
BSD 3-Clause "New" or "Revised" License
7 stars 7 forks source link

Migrate "Frameworks" Page #399

Closed loganfranken closed 3 years ago

loganfranken commented 3 years ago

384

Legacy Page https://webguide.ucsb.edu/frameworks/

Location in New Hierarchy ???

I'm not sure that we need this page: it merely notes the existence of frameworks. Not sure if we have a framework we are standardizing on? (I think the main template is Bootstrap-based, right?)

Front-end frameworks are collections of guidelines and resources (JavaScript files, CSS files, etc.) to support the efficient development of websites.

These frameworks generally include JavaScript or CSS that handle common "boilerplate" scenarios (laying out a website in columns, responsive navigation, and so on).

For example, when using the popular framework Bootstrap, tabbed navigation can be added with the following markup:

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" href="#">Home</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">About</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Messages</a>
  </li>
</ul>

In this example, no additional CSS is required to style this list element as a series of tabs; the framework simply handles this work for us.

Examples of popular frameworks include:

While these frameworks are powerful tools, keep in mind that they come and go: as a result, you should not plan on depending on a framework indefinitely.

Instead, ensure you have a fundamental understanding of what the framework provides and how you could write this "boilerplate" code for yourself.

BwolfUCSB commented 3 years ago

Bootstrap is a good example..

On Sep 8, 2020, at 8:45 AM, Logan Franken notifications@github.com wrote:

384 https://github.com/ucsb/webguide/issues/384

Legacy Page https://webguide.ucsb.edu/frameworks/ https://webguide.ucsb.edu/frameworks/ Location in New Hierarchy ???

I'm not sure that we need this page: it merely notes the existence of frameworks. Not sure if we have a framework we are standardizing on? (I think the main template is Bootstrap-based, right?)

Front-end frameworks are collections of guidelines and resources (JavaScript files, CSS files, etc.) to support the efficient development of websites.

These frameworks generally include JavaScript or CSS that handle common "boilerplate" scenarios (laying out a website in columns, responsive navigation, and so on).

For example, when using the popular framework Bootstrap http://getbootstrap.com/, tabbed navigation can be added with the following markup:

In this example, no additional CSS is required to style this list element as a series of tabs; the framework simply handles this work for us.

Examples of popular frameworks include:

Bootstrap http://getbootstrap.com/ Foundation http://foundation.zurb.com/ While these frameworks are powerful tools, keep in mind that they come and go: as a result, you should not plan on depending on a framework indefinitely.

Instead, ensure you have a fundamental understanding of what the framework provides and how you could write this "boilerplate" code for yourself.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/ucsb/webguide/issues/399, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADFFMMZITMUYZRIX75CRLILSEZGRDANCNFSM4RAE33QQ.

Brian Wolf Developer / Designer LSCG Web Design Services UC Santa Barbara

webdesign.lscg.ucsb.edu wolf@ucsb.edu

loganfranken commented 3 years ago

Hey @BwolfUCSB! Bootstrap is listed on the current version of this page (https://webguide.ucsb.edu/frameworks/). Did you have thoughts around its use or how it's represented on the page?

BwolfUCSB commented 3 years ago

I use it on hundreds of sites. :)

It is the basis of all my themes and what the ucsb main site is based on.

On Sep 15, 2020, at 8:43 AM, Logan Franken notifications@github.com wrote:

Hey @BwolfUCSB https://github.com/BwolfUCSB! Bootstrap is listed on the current version of this page (https://webguide.ucsb.edu/frameworks/ https://webguide.ucsb.edu/frameworks/). Did you have thoughts around its use or how it's represented on the page?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/ucsb/webguide/issues/399#issuecomment-692802345, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADFFMM347AZWZYTII3JIGOLSF6DSXANCNFSM4RAE33QQ.

Brian Wolf Developer / Designer LSCG Web Design Services UC Santa Barbara

webdesign.lscg.ucsb.edu wolf@ucsb.edu

tenken commented 3 years ago
ilessing commented 3 years ago

in WSG meeting today @rvizena mentioned getting into TailWindsCSS lately.

Here is a nice definition of Front End frameworks:

A front-end Framework is a collection of HTML, CSS, and JavaScript containing design patterns that you can build upon. They keep you from wasting time rewriting boring, boilerplate code over and over again. In addition to saving time, they actually help you write better code.

from the foundation About page

rvizena commented 3 years ago

added framework content at bottom of CSS page: https://dev-webguide-ucsb-edu-v01.pantheonsite.io/development/css