foundation / foundation-sites

The most advanced responsive front-end framework in the world. Quickly create prototypes and production code for sites that work on any kind of device.
https://get.foundation
MIT License
29.65k stars 5.49k forks source link

discussion: v7 #11847

Closed DanielRuf closed 3 years ago

DanielRuf commented 4 years ago

Description

Foundation v7 will likely be a monorepo and contain different packages. Compiler, design system, theme & customizer, the different components, plugin system.

We might also create codemods for easier migration of a few things plus some foundation-migrate.js which outputs console information for migrating current code.

Possible Solution

Some compiler like svelte or stencil. We will use yarn workspaces probably or lerna with yarn and a rolling SemVer release process.

https://github.com/semantic-release/semantic-release

Checklist

SassNinja commented 4 years ago

@DanielRuf do you already have a solution in mind for managing the packages? maybe lerna?

DanielRuf commented 4 years ago

I propose lerna with yarn.

DanielRuf commented 4 years ago

I think we can already experiment with the new monorepo and move some current parts to it (plugins for example).

paulfelton commented 4 years ago

Has anyone considered whether it might be possible to generate web components as a target for foundation's components? Or stencil components that could be transpiled?

This could make it easier for components to be versioned individually, and incorporated in the end-designer's design systems (regardless of the technology they base it on). Likewise for the developer, they could use the components regardless of whether they're generating an Vue, Angular, React (to a certain extent) or vanilla site?

DanielRuf commented 4 years ago

Has anyone considered whether it might be possible to generate web components as a target for foundation's components? Or stencil components that could be transpiled?

This is one of our plans.

DanielRuf commented 4 years ago

I added the link to semantic-release. In the future we should publish only on npmjs (and additionally on GPR) - GitHub Package Registry).

Other frameworks and platforms can and should consume npm packages or unpkg files.

paulfelton commented 4 years ago

Out of curiosity, do you have a roadmap to version 7, or aspirations? I've seen the project board.

DanielRuf commented 4 years ago

@paulfelton we had a small one but I would say we should revise / update it.

https://github.com/foundation/foundation-sites/wiki/Project-Roadmap

DanielRuf commented 4 years ago

@joeworkman to which platforms do we currently / until now publish to? I want to check if and how they can consume npm packages and if we can publish only to npmjs in the future.

Bower for example registered the old foundation-sites package to the zurb organization.

joeworkman commented 4 years ago

We will definitely start to organize our thoughts around F7 very soon. It will be a lot of work and hopefully we can get more awesome devs to contribute.

@DanielRuf Right now I only publish to NPM and RubyGems. We used to publish to meteor but that was stopped a long time ago. For F7, we can probably pair that down to just NPM.

As for the npm organization. I sent their support team multiple requests and never heard back. For F7, it would definitely be nice to have our own org. I will keep pestering them. Now that they are ran by Github, it may be easier.

joeworkman commented 4 years ago

This issue has been mentioned on Foundation Open Source Community. There might be relevant details there:

https://foundation.discourse.group/t/foundation-and-css-variables/2469/4

Geddo commented 4 years ago

css-variables would be awesome. I integrated it for a bunch of objects like this:

_settings.scss: :root{ --current-color: var(--primary-color, var(--default-color,#FF0000)); }

So if the css-variable --primary-color is not set, I use the default color #FF0000 for it. For all other elements which should use the new css-variable I created a mixin then like this: .header { background: $primary-color; @include colorfrompage("background-color"); }

or like .h1{ @include colorfrompage("color"); }

And this is my simple mixin: `@mixin colorfrompage($property) { transition: all 0.25s;

{$property}: var(--current-color);

}`

So with that I can easly set a new primary-color via a css-variable in my pages head and with additional scripts like swup.js I get smooth page and color transitions :-)

joeworkman commented 4 years ago

CSS custom properties are definitely something that we want in v7. I have already started a modified version of v6 that supports them already. Although, it’s just a proof of concept. A big change like this should happen in v7.

ettoredn commented 4 years ago

If I may suggest:

  1. focus on the grid system / SCSS framework and release an early version with that only
  2. drop as many plugins as there are already well working alternatives for them
  3. build the remainder plugins as reusable web components using StencilJS and TypeScript
dlewand691 commented 4 years ago

For consideration, using CSS variables, this technique looks pretty intriguing as a way to write less code. https://propjockey.github.io/css-media-vars/

joeworkman commented 4 years ago

I actually already have a build that uses CSS variables. Its not perfect but it's definitely the way to go moving forward. The side effects is that we cannot use Sass color math for many things when using CSS variables. But a lot of effects can be achieved with CSS filters and other modern css techniques.

paulfelton commented 4 years ago

I'd vote for stenciljs too, possibly then documenting with Storybook

DanielRuf commented 4 years ago
  1. We schedule a date sometime around the end of august or september for an open zoom meeting that meets on a regular basis with an agenda.

Who is "we"? Currently only Joe and I are actively working on Foundation.

  1. We publish steering meetings to youtube just like Node does.

Much effort and work for such a small project in my opinion. In general we already have a roadmap for a long time. But no time besides work and other projects.

  1. We start a private monorepo until alpha that is invite only to people on the steering committee.

Not a good idea, development will be always in the public. No private repos and no invite only stuff.

  1. We solidify our build process, CI

Both work, I see no reason to change anything.

Not sure but most of these points are either not relevant, need more active contributors or repeat what we already have in the roadmap and in the relevant issues.

DanielRuf commented 4 years ago

Also it just took over a month to publish a simple fix to the CLI

Please keep in mind that Joe and I do this in our free time and for free. Just saying.

DanielRuf commented 4 years ago

The whole point of what I'm suggesting is to be constructive and help get more active contributors and re-engage the community so that rather than building out features on a roadmap others suggested and abandon, we take a fresh look and start with DOING it. Nothing about your comment is constructive to your own end goals.

To be honest, what would help us at the moment would be to have more reviews on open PRs, PRs for open issues and issues resolved so we can make a clear cut and start the work on v7. Nothing against you or others, there is just still much to do before we can move on. And to decide. And most things are already decided on the original roadmap + some decisions and ideas mentioned here. Ideas are very welcome but I know that most of the volunteers can and will not attend such meetings - we tried that in the pst with all Yetinauts and it didn't really work.

If you want to organize this (date, time, people, accounts, ...) you are very welcome to do so and help usw. I do not have the time for this and I speak from my past experience (Nodejs org, Foundation and others) and it's not that easy.

DanielRuf commented 4 years ago

Honestly, why would I even want to submit a PR

PRs are always reviewed when I find some time. And we merged some in the last weeks. We have to get the other projects forward too (Foundation emails got some new releases, you might have noticed that).

DanielRuf commented 4 years ago

This is why I've maintained my own internal branches of foundation for sites, email and the cli for the last 3 years rather than submitting a PR.

Gatekeepig will not help us at all to bring this forward togehter. I propose you submit some PRs, we check if the proposed changes would be good and we can plan them for the next releases.

DanielRuf commented 4 years ago

As for PR's I'd be happy to review existing PR's test them and either close them or recommend a merge. But if you are looking for new PR as they relate to foundation/foundation-sites/milestone/40, that's not something I can commit to, Trust me, if I could commit to them, I would.

We welcome reviews and contributions for current and new PRs too. You do not have to contribute new PRs if the issues are too complicated / not that easy to solve.

We all have other priorities at work and at home but I don't believe that PR's or the lack there of should roadblock implementing V7 after a 3 year delay...

Well, users of the other projects ask also for updates so we fight on multiple fronts. Like I wrote, Foundation Emails got a few new releases and other projects too. We should resolve the big issues there before we move on - especially as it makes not much sense to open a big new project (v7) and directly drop support for v6 (with such few active people helping with the current tasks).

And I'm also active in other projects so I can not invest so much of my free time.

We had I think 10+ volunteers on the conference calls for foundation 6 alpha, etc.

Currently all other Yetinauts are not actively involved anymore since the move to a community project. Maybe you might have a better connection to them.

When I joined Nicolas tried to do these meetings but after a while we stopped doing them because no one joined or had time.

ettoredn commented 4 years ago

I have been wondering: why nobody is interested anymore in Foundation? Are better alternatives out there? Does anyone need a CSS grid framework anymore?

Don't tell me Bootstrap is an alternative. Bootstrap is trash.

ettoredn commented 4 years ago

Am I wrong in stating that Bootstrap is more oriented towards prototyping while Foundation is about building actual sites?

What are the exact use cases Foundation is supposed to help with?

ettoredn commented 4 years ago

In other words it's in an awkward transition between web pages being the standard and the new web standard of web components.

I wouldn't go as far as calling it a transition. WC fit enterprise design systems well, but I'm not so sure about small and mid size projects. I'm trying to use them through StencilJS right now on a project, and unless you just go full framework like Angular/React (by this I mean you make everything a component because why not), design choices (what should this component do? what should be componentized and what not?) are not so clear, so far.

Case in point: try to use shadow DOM and use Foundation's grid (and the grid only via @include) in multiple component.. Look at that, so many duplicated CSS. Very nice for page performance. The result is that you basically have to forget about shadow DOM, which questions the need to use it in the first place, that is unless you have enterprise like design systems.

pboling commented 3 years ago

I have a very narrow comment on the mono repo idea. Want to make sure that having separate repos for plugins is given full consideration. Generally the benefit would be forcing a first-class plugin system, which both official and third party plugins must use. Keeping the plugins inside the mono repo might discourage third party development, or prejudice the tooling in ways that make it more difficult to use a third party plugin than a built-in.

This comment may be quite irrelevant though, given how little I know of the plugin architecture, and having the official plugins developed as part of a holistic core release is also appealing.

Thanks for building Foundation! If my dev path had turned down the front end road I'd be jumping in to help more.

k33n8nc commented 3 years ago

Count me in... im with Foundation for 6+ years now. Can help with different things... experience: js, jquery, es(x), css, sass, html, float-g, flex-g, css-g, npm, yarn, node, webpack, wordpress, php, and many more. There must be something i can do 💯 .

Let make this Christmas a good one :)

k33n8nc commented 3 years ago

Seems really dead now. Even bootstrap is catching up with Bootstrap 5.

DanielRuf commented 3 years ago

@Baggio89 feel free to review some PRs and issues. But at the moment I am not that much involved in Foundation Sites anymore.

k33n8nc commented 3 years ago

That's a pity. Shouldn't someone else take over then? It's such a waste not releasing a new foundation sites.

joeworkman commented 3 years ago

One of my goals for 2021 is to make good headway on F7. I would like to build a small core group that would like to help push it forward. I am finally wrapping up a couple of big projects from 2020. I have reserved time in Q2 to start working on this more. If you would like to be involved in the process, let me know.

dlewand691 commented 3 years ago

Hi @joeworkman. I'm a huge fan of Foundation and been using it since about version 3. I work for Cognizant and it has been our framework of choice for the last few years. Our company has over 280,000 employees in 37 countries so we rely heavily on the flexibility and speed of rapid prototyping that Foundation gives us. I'd like to volunteer to help out wherever I can, mainly on the CSS development.

I've created a framework for our dev team that expands on Foundation's capabilities and would love to get your (and others) thoughts on it. Take a look at this repo:

https://github.com/dlewand691/_COG-Framework-2020

A high-level wish list of things for V7 I'd like to request/suggest/discuss are:

Anyhow, please let me know your plans and how I can help. I don't want to see Foundation die, it's too valuable a resource! Look forward to hearing your thoughts. Thanks!

rahiyansafz commented 3 years ago

what's new @joeworkman ??? when will V7 come?

kylek14 commented 3 years ago

One of my goals for 2021 is to make good headway on F7. I would like to build a small core group that would like to help push it forward. I am finally wrapping up a couple of big projects from 2020. I have reserved time in Q2 to start working on this more. If you would like to be involved in the process, let me know.

Out of curiosity, what help are you looking for? Interested in helping but more on the supporting side (webdev, docs, etc.)

IamManchanda commented 3 years ago

Very Good Morning, In this Modern Web Tech, If Foundation 7 has to become a reality

This is what we need to do

  1. Make Foundation 7 CSS/SCSS on par with Bootstrap 5 CSS/SCSS
  2. JavaScript: Remove jQuery Dependency, docs should contain not only html examples but also Vue, React & Angular examples.
  3. Just-in-Time Mode https://tailwindcss.com/docs/just-in-time-mode
  4. Make Foundation Prototyping Utilities to be on par with Tailwind CSS extensive list of classes and make them available by default with Just-in-Time Mode
  5. Make Foundation Building Blocks to be on par with Tailwind UI or https://tailblocks.cc/
qeet commented 3 years ago

@IamManchanda

I just released a library that lets you use all the Tailwind utilities with the current version of Foundation. All you need to do is include a tiny (~8Kb) Javascript in your page and then you can use all Tailwind utilities to style your Foundation components.

See: https://github.com/qeet/foxtailcss for docs & code

DaSchTour commented 3 years ago

@IamManchanda instead of reinventing the wheel maybe foundation should build on top of tailwind and simply provide some nice UI components. There is a lot of effort in building something like tailwind and simply rebuilding it would not do the trick. It will always fall behind tailwind.

DanielRuf commented 3 years ago

@IamManchanda instead of reinventing the wheel maybe foundation should build on top of tailwind and simply provide some nice UI components. There is a lot of effort in building something like tailwind and simply rebuilding it would not do the trick. It will always fall behind tailwind.

Exactly. We know how reinventing the wheel went in the past (orbit, grids, ...) which ended in more problems and work than a small team could do.

k33n8nc commented 3 years ago

Tailwind, Alpine JS and Laravel Mix, ready, set, go!

dlewand691 commented 3 years ago

Madosel is a great new framework, currently in alpha, but could be a great inspiration for next steps on Foundation. Take a look here: https://www.madosel.com/

pboling commented 3 years ago

Svelte is the next major framework in Javascript, so integration with Svelte (which already has first class Tailwind support) should be a goal of a future Foundation. Svelte will eat much of React, Vue and Angular over the next couple years.

IamManchanda commented 3 years ago

@IamManchanda instead of reinventing the wheel maybe foundation should build on top of tailwind and simply provide some nice UI components.

I am cool too ... yes reinventing the wheel wouldn't make sense with short team

joeworkman commented 3 years ago

I know that Tailwind is the cool new(-ish) kid on the block. However, I do not see Foundation 7 will be going that way. Utility classes are useful. But there are limits to how far I feel they should go. F7 will be blazing new trails.

joeworkman commented 3 years ago

I will be doing another hangout soon if anyone wants to be a part of that... https://foundation.discourse.group/t/foundation-7-hangout-looking-forward-to-f7/

rahiyansafz commented 3 years ago

I will be doing another hangout soon if anyone wants to be a part of that... https://foundation.discourse.group/t/foundation-7-hangout-looking-forward-to-f7/

Please Joe! make foundation Great again.

joeworkman commented 3 years ago

I have another hangout setup for next week for those that can make it... https://foundation.discourse.group/t/july-hangout-for-foundation-7/4611

edoardo-bluframe commented 3 years ago

Hey everybody!

Mega upvote for:

Can I help as a dev?

adventdesignllc commented 2 years ago

@joeworkman Any updates on F7 progress? Still passionately using F6 and fighting off calls to drop it as a dead foundation for web projects. Tried other alternatives and nothing compares to Foundation!

maietta commented 2 years ago

Hi @adventdesignllc, I'd love to see a version 7 released as well. The project is certainly not dead. It's just a really stable framework.

I have been using Foundation 6.5+ with Vue 3 + Vite for some time now and even build a project base around it at https://github.com/PremoWeb/SDK-Foundation-Vue that is worth checking out if you want to adopt Foundation with Vue 3.

I would absolutely love to devote all my time to open source projects instead of working on client projects but client projects are what pay the bills. I'm seriously considering spending some time before fall and winter to drum up enough sponsorship so I can make the transition to working on projects like Foundation full time. The sooner we have people who can devote serious hours to the project, the sooner everyone benefits. I still feel that Foundation for Sites is the very best front-end framework for modern websites though I do feel there is room for improvement, especially from a web developer's perspective.

It'd be rad to drum up about $4-5k/mo which is nothing these days to devote my time to this. I am by no means a front-end developer but I do have nearly 10 years of experience using Foundation. (Wow, has it really been that long?) I know that I was using Foundation for some time before attending the Foundation 5 software launch party back in 2013. That was an amazing experience getting to meet the people behind the project and pick their brains for all that juicy info about web design, goals, the vision of the future, etc. Those people really know their stuff.

One thing I can offer to the table is complete tooling for every platform (Linux, Windows & Mac), and the ability to integrate into existing frameworks like Vue 3, React, Angular, etc. I can build a website from top to bottom that can replace the existing, overly complicated get.foundation system which I think is built upon proprietary hosting (or at least, it used to be).

My current Vue + Foundation template mentioned above does give me that live hot-reloading capability that first got me interested in the SASS version using Gulp, etc. I had nothing but problems trying to use Foundation's provided tools as things were evolving way too fast. Bowser, Yarn, Gulp, these were all new to me at the time so that was probably my issue.

I've got a version of Foundation that works with Webpack somewhere, but I ran into a strange edge case issue that I couldn't easily resolve, which caused me to look at Vite build system instead, which did solve my issue.

Foundation 7 should certainly be built to operate easily within existing build systems by default. It should be easier to configure and there should be a fresh website with an improved catalog of ready-to-use components.

Mixins should be easier to understand and use. To this day, I still can't figure out how to get mixins working properly within my Vite system. With more time spent on this, I could probably have this hammered out.

Anyway, I don't know what's up with the status of 7, as it's been MANY YEARS since it was first discussed. I really hope we can get some serious interest in it. So far, I really only see one person who works a lot on this project but my guess is he's got to pay his bills too and I don't think this project pays anything at this point. The joys of Open Source!