搜尋
首頁web前端css教學我的開發ama的剪輯

我的開發ama的剪輯

Apr 13, 2025 am 10:55 AM

我的開發ama的剪輯

我最近在開發人員上做了一個AMA。只是藉此機會在這裡搬遷一些答案,例如一個好的indiewebber。

如果您是在2020年最初的前端開發人員,那麼您會說您要學到的第一件事,為什麼?

您需要將自己置於創建和照顧網站的工作的位置。即使這對您來說就像是一段伸展。獲取域,在公共互聯網上獲取網站。將您的名字放在上面。現在,您已經給了自己的賭注,您將學習技術,因為您必須使自己的想法栩栩如生。

對我來說,650年前,這為Ol'College樂隊建立了一個網站。我們需要一個網站!對我來說,這聽起來很有趣,我設法通過購買域名,託管和建立WordPress網站來掙扎。然後,隨著時間的流逝,我學習了前端網絡技術,因為我想更改設計,更改模板,添加酷功能等。

獲取一個項目並通過該項目學習。

您如何確定要變成博客文章的內容以及簡單的推文留下的內容?

我通常不會避免推文。無論如何,這條推文通常是博客文章的良好證明基礎。如果沒有人關心的話,嗯,也許不是那麼好。如果它確實獲得了良好的參與度,那就像是周圍的對話對創建博客文章很有用。另外,推文非常容易踢出門。對我而言,博客文章的時間表更長,包括編輯和日程安排等。

這是一個示例推文。只是一個愚蠢的小UI實驗。我不想在等待博客以放棄演示。但是從Twitter線程中,我得到了一些有趣的技術反饋,有關人們最令人驚訝的零件的信息以及其他相關的想法。希望這將導致一篇更強大的博客文章。

老實說,我什至對待開發人員。我在這裡很快寫了這個博客文章的反應,但隨後用一些反饋將其改進了我自己的博客。

您是否有喜歡的CSS漫步,就像“哇”一樣?

我認為CSS中的“滾動陰影”是我有史以來最喜歡的CSS技巧之一。它最初是由羅馬·科馬羅夫(Roman Komarov)講的,但由Lea Verou進行了解釋和改進。前幾天,我看到了Stefan Judis圍繞這個想法的工具。

這是一個真正的思想彎曲者,涉及四層梯度背景,每個背景都定位,大小和顏色不同,然後在滾動方面行為上有所不同。

這不僅是一個整潔的技巧,因為它具有真正的UX含義。顯示您可以滾動的陰影很重要。考慮一下iOS最近的設計更新的故事,導致圍繞UI動作的混亂,隱藏在您可以滾動的地方,但對如何到達那裡的負擔為零。 (在記錄中,我一直在Spotify發生在我身上。)

對於試圖遵循與他們的影響力和曝光相似的開發人員,您的前三名快速建議是什麼?

我認為寫作實際上是唯一的方法

我想不出具有影響力的開發人員對寫作以外的任何事物都有影響。或者,如果不是寫作,則是YouTube頻道或其他創建公共內容的其他形式。

您看到自己在發布Houdini API時親自玩了多少?您對哪個API最興奮(繪畫,佈局,輸入OM,…)?

這個超低的東西有時會感覺到我的頭。我很難通過查看規格來描繪這樣的事物的行業含義,您知道嗎?

對我來說,佈局API似乎具有最強大的潛力。

我現在想像的是,Houdini不會對像我這樣的正常日常前端開發人員如此多。我不會寫太多的houdini代碼。但是我會使用其他人創造的精美事物,因為它對我有用。就像大多數人不編寫自己的庫或發布了NPM軟件包一樣,他們只是使用它們。

被Houdini哇,這很有趣。如果有人在尋找,請確保查看Vincent de Oliveira的展示網站。

您最喜歡在Codepen和/或CSS-Tricks工作的事情是什麼?

你知道我真正喜歡什麼嗎?我喜歡每天上辦公室,並擁有相當體面的自由度,因為我將要做那天要做的事情。我可能會開會。我可能會在OL'日曆上有一些東西。我可能會有一些團隊的期望。但是我通常也有足夠的時間去追求目前對我很有趣的事情。

有時我當時要鑽一些電子郵件。有時我想修改一些聽起來很有趣的演示。有時我想寫一個想法或錄製視頻。有時我想計劃一些東西或記錄一些東西。有時我想與他人談談或做一些配對編程。

我很幸運,我是老闆(大聲笑),我故意將自己置於這個職位,所以我有自由。

您希望我們可以在CSS中添加什麼?

我覺得每當有人問這個問題時,我們都應該藉此機會尖叫集裝箱查詢!直到我們得到他們。

這個想法是,我們應該能夠編寫CSS,上面寫著:“當此元素如此寬時,該CSS應該生效。”不僅是寬度,而且我們已經在頁面級上進行的任何媒體查詢。

用例中最好的演示是菲利普·沃爾頓(Philip Walton)的頁面。

我想編寫一個卡片組件,該卡組件會根據其寬度而不是頁面的寬度來調整自身,因為這兩件事之間並不總是直接連接(例如,一個卡組件可以在大屏幕上的狹窄側欄中顯示在狹窄的側邊欄中,但在平板電腦上會全寬)。

每個組件都可以處於這種情況下,因此,對於CSS的熱愛,讓我編寫媒體查詢範圍為這些組件。當我看到如果有的話,我會回應很多其他人,我們寫的絕大多數媒體疑問就是這些,而不是頁面級別。

您認為值得提出{位置:折疊以上嗎? }?

我不確定我的職業生涯曾經做出過一個大的決定。這不是那個想法的忠實擁護者。在一條線上,這個重要的模塊不得穿越,哈哈。當然,優先考慮最重要的東西要更高頁面。網站不會像報紙那樣折疊。

另外,我們現在已經有了視口單元,因此,如果您絕對需要將某些東西放在頂部可見的視口區域,則可以。

既然您寫了這麼長時間的博客文章,那麼您是否開發了一個寫作過程?

sort!對我來說仍然感覺很隨意(我們稱我的寫作中等質量),所以這並不像我在曠野租用小屋並在日落和廉價威士忌中找到靈感。

  • 我寫下了我出現的每個博客文章想法。我試圖將該列表保持在公開狀態,但我也有一個個人清單,甚至可以使我更加滑動。
  • 我將盡可能多的上下文放入這些列表中,因此我可以希望召喚出使我首先寫下來的同樣的情感。如果我一周後重新審視這個想法,那可能不是一個好主意。
  • 我用盡可能多的上下文寫下帖子。通常涉及輕度研究。
  • 我們有CSS-Tricks的首席編輯,因此在安排之前,至少有一個人對其進行了審查。

CSS還是CSS-IN-JS?

我看到CSS-In-JS中發生了很多很酷的事情。我認為它解決了某些網站的許多有趣問題。例如,我非常喜歡有一個選項編寫範圍範圍為組件的樣式的想法,因此,當不自動使用該組件時,會搖搖欲墜。

但是網絡是一個很大的地方,我敢說大多數網站不是使用JavaScript供電的組件模型構建的。因此,CSS-IN-JS並不需要或適合許多站點。

雖然,要明確兩件事:

  • 沒有CSS,您將無法擁有CSS-IN-JS。 CSS-IN-JS仍然是應用於元素的樣式。它不會使您無法學習CSS。
  • CSS-IN-JS景觀廣闊。如此模糊地談論有點困難。 CSS-In-JS桶中的每個項目都以不同的方式處理事物,並且如何將樣式應用於網站甚至相當寬。我認為有時會失去某些方法,即某些方法實際上會像其他任何其他CSS(甚至是Sass生產的CSS)一樣鏈接您的CSS樣式表,這似乎不再有太多論證了。

以上是我的開發ama的剪輯的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
我們是程序員我們是程序員Apr 14, 2025 am 11:04 AM

構建網站正在編程。編寫HTML和CSS正在編程。我是程序員,如果您在這裡閱讀CSS-Tricks,那麼您很有可能是您

您如何從網站上刪除未使用的CSS?您如何從網站上刪除未使用的CSS?Apr 14, 2025 am 10:59 AM

在這裡,我想預先知道的是:這是一個很難的問題。如果您降落在這裡,因為您希望指向您可以運行的工具

圖片中的圖片網絡API簡介圖片中的圖片網絡API簡介Apr 14, 2025 am 10:57 AM

圖片中的圖片在2016年發行了Macos Sierra,在Safari瀏覽器中首次出現在網絡上。這使用戶可以彈出

使用Gatsby組織和準備圖像以使圖像模糊效果的方法使用Gatsby組織和準備圖像以使圖像模糊效果的方法Apr 14, 2025 am 10:56 AM

蓋茨比(Gatsby)進行了出色的處理和處理圖像。例如,它可以幫助您節省圖像優化的時間,因為您不必手動

哦,嘿,填充百分比基於父元素的寬度哦,嘿,填充百分比基於父元素的寬度Apr 14, 2025 am 10:55 AM

今天,我學到了一些有關基於百分比的(%)填充的知識,我腦海中完全錯了!我一直認為百分比填充是基於

何時使用SVG與何時使用帆布何時使用SVG與何時使用帆布Apr 14, 2025 am 10:43 AM

SVG和畫布都是可以在網絡瀏覽器中繪製東西的技術,因此它們值得比較和理解何時更合適

一個超級怪異的CSS錯誤,影響文本選擇一個超級怪異的CSS錯誤,影響文本選擇Apr 14, 2025 am 10:41 AM

您知道如何(在某種程度上)使用::選擇的文本樣式?好吧,傑夫·斯塔爾(Jeff Starr)發現了一個怪異的CSS錯誤。

兩值顯示語法(有時三個)兩值顯示語法(有時三個)Apr 14, 2025 am 10:40 AM

您知道單值語法:.thing {display:block; }。值“塊”是一個值。顯示有很多單一值。為了

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
4 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )專業的PHP整合開發工具

MantisBT

MantisBT

Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

WebStorm Mac版

WebStorm Mac版

好用的JavaScript開發工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。